您的位置:首页 > 其它

看书的心得

2013-07-17 15:42 134 查看
var myObject = (function() {
var value=0;
return {
increment:function(inc) {
value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return value;}
}
}());
// document.write(myObject.getValue());
myObject.increment(3);
document.write(myObject.getValue());  //3
要注意到,increment后是匿名函数。为什么这样能获得value的值呢?闭包 !闭包能打破函数作用域(跟C语言中的块级作用域类似)的限制,使得函数体内的变量能够附加或加载给内部函数(就像内部函数已经定义过一样,其值为该变量最终的值)。其实。要正确地理解第一个匿名函数的代码,其中,return后面的代码,它是json格式的,也就是说该匿名函数会返回一个对象。

函数内的变量和属性的区别:函数内的变量是函数的定义环境,而属性是函数自身能拥有的,在外头能以.或[str]的方式使用。this的就是代表该函数/对象 或者 window

值得一提的是:第一个匿名函数,虽然在全局里执行,但是其value并没有给全局环境下添加了value属性,value属于匿名函数级作用域下变量

函数级的作用域指的是所有在函数内定义的参数、变量不能给外部的函数获得,但这些变量能够通过闭包,被该函数内任意位置的内部函数获得。(而且在一个函数中的任何位置定义的变量在该函数中的任何地方都可见)

--------------------------------修改1

var myObject = (function() {
var value=0;
return {
increment:function(inc) {
this.value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return this.value;}
}
}());
alert(myObject.getValue());    //undefined
为什么弹出的是undefined ?而不是0 ?

变量myObject最终得到一个对象,其有两个方法,increment和getValue ,并没有value属性 ,因此,在调用的时候,this是指向对象myObject的,所以,它得到一个undefined ,因为它返回一个它没有的属性,所以undefined.

------------------- 修改2,去掉var

var myObject = (function() {
value=0;
return {
increment:function(inc) {
this.value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return this.value;}
}
}());
alert(myObject.getValue());     //undefined


注意到,value是给window添加一个属性,但是,当对象的方法调用时,this指向该对象myObject,而对象myObject没有value的属性,因此,还是得到undefined

-------------修改3,添加var that=this

var myObject = (function() {
var  value=0;
var that = this;
return {
increment:function(inc) {
that.value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return that.value;}
}
}());
alert(myObject.getValue());     //undefined


匿名函数中,其上下文环境是window,必然this指向window,所以,that还是指向window,因此,还是得到undefined

----------修改4,具名函数

function aaa() {
var  value=0;
return {
increment:function(inc) {
this.value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return this.value;}
}
};

var myObject =aaa();
document.write(myObject.getValue());     //undefined
document.write(myObject.getValue()); //undefined

具名函数,其中变量myObject得到一个对象,该对象有2个方法,increment和getValue ,并没有value 属性,因此,再次调用对象myObject里的方法时,this还是指向该对象myObject,但是,获取一个不存在的属性,还是输出undefined

----------修改5

var myObject = (function() {
value=0;
return {
value:this.value,
increment:function(inc) {
this.value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return this.value;}
}
}());
document.write(myObject.getValue());   //0
这样,变量myObject最终获得一个对象,其拥有value属性和increment、getValue的两个方法,其中,value还是获取全局对象的value,当对象myObject调用getValue方法的时候,getValue内的this指向对象myObject,这样就获取其自身的value的值 .

但是,value是全局变量。 当increment方法调用时,改变的是其自身的value,全局的value还是不变。

var myObject = (function() {
value=0;
return {
value:this.value,
increment:function(inc) {
this.value += typeof inc === 'number' ? inc : 1;
},
getValue:function() {return this.value;}
}
}());
myObject.increment(4);    //myObject.value=4
document.write(myObject.getValue());  //4
alert(value);     //0


这些例子的修改,只是想说明this会根据执行的环境变化。虽然可以总结出规律来。最近看了本e文书,上面的this做了很多精彩的说明,截取出来。

When a function is created, a keyword called this is created (behind the scenes), which links to the object in which the function operates. this is available to the scope of its function, yet is a reference to the object of which that function is a property/method.

this is used inside of functions to refer to the object the function is contained within, as opposed to the function itself [exceptions include using the new keyword or call() and apply()].

翻译: this是用在函数内部的,用来指向某对象,而该对象包含使用this的这个函数。 (例外之处:new 和 call apply)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: