注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

星期五

明天不上班

 
 
 

日志

 
 
关于我

一个特立独行的Java程序员,比较宅,上上网,写博客,听音乐,看电影。

网易考拉推荐

一道Javascript面试题  

2012-10-16 18:59:12|  分类: Javascript |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
下面Javascript语句的输出结果是什么

var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};

alert(object.getNameFunc()());

---------------------------- 分割线 -----------------------
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
var that = this;
return function(){
return that.name;
};
}
};

alert(object.getNameFunc()());

其实很简单,只要搞清楚Javascript函数的四种调用模式,就一目了然了。

那么什么是函数的四种调用模式:关于函数四种模式(摘抄自《Javascript语言精髓》)

方法调用模式

函数调用模式

构造器调用模式

apply调用模式

this在四种调用模式下的意义:

1.方法调用模式

当一个函数被保存为对象的一个属性时,我们称它为一个方法,当一个方法被调用时,this被绑定到该对象。

如果一个调用表达式包含一个属性存取表达式(即一个.点表达式或[]下标表达式),那么它就被当作一个方法来调用。


//创建myObject,它有一个value属性和一个increment方法

//increment方法接受一个可选的参数,如果参数不是数字,那么默认使用数字1


var myObject = {

       value: 0;

       increment: function() {

           this.value += typeof inc === 'number' ? inc : 1;

       }

};


myObject.increment();

console.log(myObject.value); //1

myObject.increment();

console.log(myObject.value); //3


方法可以使用this去访问对象,所以它能从对象中取值和修改该对象。this 到对象的绑定发生调用的时候。这个“超级”

迟绑定,使得函数可以对this高度复用。通过this取得它们所属对象的上下文的方法称为公共方法。


2.函数调用模式

当一个函数并非一个对象的属性时,那么它被当做一个函数来调用

var sum = add(3, 4);


当函数以此模式调用时,this被绑定到全局对象。这是语言设计上的一个错误

所以当我们在使用回调函数时(回调函数的执行时,如果使用的函数模式调用的话,也可以使用其他模式调用,所以这里的说法不准确),就必须使用下面的技巧去避免这个错误。

所以在我们使用这种函数模式的时候需要注意了:

myObject.double = function() {

     var that = this; //解决上面提到的错误

     var helper = function() {

           that.value = add(that.value, that.value);

     };

     helper(); //以函数模式调用helper。 

};


//以方法模式调用double

myObject.double();

console.log(myObject.value); //6


3.构造函数调用模式

Javascript是一门基于原型继承的语言。这意味着对象可以直接从其他对象继承属性。该语言是无类别的

这个偏离了当今语言的主流。大部分语言都是基于类的语言,尽管原型继承有这强大的表现力,但是它不被广泛理解。

如果一个函数前面带上new来调用,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this会被绑定到这个新对象上

new前缀也会改变return语句的行为。


//创建一个名为Quo的构造函数,它构造一个带有status的属性对象

var Quo = function(string) {

this.status = string;

};

//给Quo的所有实例提供一个名为get_status的公共方法


Quo.prototype.get_status = function() {

return this.status;

};


//构造一个Quo实例

var myQuo = new Quo("confused");

myQuo. get_status();


4.Apply调用模式

因为Javascript是一门函数式的面向对象编程语言,所以函数可以拥有方法

apply方法让我们构造一个参数的数组并用其去调用的函数。它允许我们选择this的值。

apply方法接收两个参数。第一个将被绑定给this的值,第二个是一个参数数组


var array = [3, 4];

var sum = add.apply(null, array); //7


var statusObject = {

       status: 'A-OK'

};


//statusObject并没有继承自Quo.prototype,但是我们可以在它上面调用

//get_status方法。

var status = Quo.prototype.get_status.apply(statusObject); //"A-OK"


现在在来看这倒面试题:
这和函数的四种调用模式有关。
第一个:函数调用模式,所以结果是My Window
第二个:函数调用模式,但是that存储的this指的是object,所以结果
My Object,这是避免函数调用模式上的设计错误


补充:
我之前没有读到那本《Javascript语言精髓》时的理解:

函数定义,function(){} 函数在浏览器中会默认挂载到window对象,所以这时的this只得是window对象,所以name是“The Window”

this对象

而第二, that存储的this指的是object,所以name指的是object对象的name



参考资料:
《Javascript语言精髓》
  评论这张
 
阅读(386)| 评论(0)
推荐

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017