关于书籍《JavaScript设计模式与开发实践》的一些学习总结,本章梳理关于this、call和apply的知识,做为设计模式的基础知识的第一部分设计模式
JavaScript 的 this 老是指向一个对象,而具体指向哪一个对象是在运行时基于函数的执行环境动态绑定的,而非函数被声明时的环境浏览器
基本能够分红如下四种状况bash
var obj = {
a: 1,
getA: function(){
alert ( this === obj ); // 输出:true alert ( this.a ); // 输出: 1
}
};
obj.getA();
复制代码
window.name = 'globalName';
var myObject = {
name: 'sven',
getName: function(){
return this.name;
}
};
var getName = myObject.getName;
console.log( getName() ); // globalName
复制代码
var MyClass = function(){
this.name = 'sven';
};
var obj = new MyClass();
alert ( obj.name ); // 输出:sven
复制代码
var MyClass = function(){
this.name = 'sven';
return { // 显式地返回一个对象
name: 'anne'
}
};
var obj = new MyClass();
alert ( obj.name ); // 输出:anne
复制代码
var obj1 = {
name: 'sven',
getName: function(){
return this.name;
}
};
var obj2 = {
name: 'anne'
};
console.log( obj1.getName() );// 输出: sven
console.log( obj1.getName.call( obj2 ) ); // 输出:anne
复制代码
Function.prototype.call 和 Function.prototype.apply 都是很是经常使用的方法。它们的做用如出一辙,区别仅在于传入参数形式的不一样app
方法 | apply | call |
---|---|---|
第一个参数 | 函数体内 this 对象的指向 | 函数体内 this 对象的指向 |
第二个参数 | 带下标的集合 | 从第二个参数开始,每一个参数被依次传入函数 |
var func = function( a, b, c ){
alert ( [ a, b, c ] ); // 输出 [ 1, 2, 3 ]
};
func.apply( null, [ 1, 2, 3 ] );
复制代码
var func = function( a, b, c ){
alert ( [ a, b, c ] ); // 输出 [ 1, 2, 3 ]
};
func.call( null, 1, 2, 3 );
复制代码
var obj1 = {
name: 'sven'
};
var obj2 = {
name: 'anne'
};
window.name = 'window';
var getName = function(){
alert ( this.name );
};
getName(); // 输出:window
getName.call( obj1 ); // 输出: sven
getName.call( obj2 ); // 输出: anne
复制代码
(function(){
Array.prototype.push.call( arguments, 3 );
console.log ( arguments ); // 输出[1,2,3]
})( 1, 2 );
复制代码