1. This关键字
这三个方法都可以绑定this值
1. call()
-
this
call方法的参数,应该是一个对象。var obj = {}; var f = function () { return this; }; f() === window // true f.call(obj) === obj // true
如果参数为空、null和undefined,正常模式下默认传入全局对象(window),严格模式下为undefined。
call方法可以改变this的指向,指定this指向对象obj。
若call方法的参数是一个原始值,那么这个原始值会转成对应的对象var f = function () { return this; }; f.call(5) //Number {[[PrimitiveValue]]: 5}
-
arguments
arguments是伪数组function add(a, b) { console.log(arguments[0]); console.log(arguments[1]); } add.call(this, 1, 2) // 1,2,第一个参数传给this,后面的都存入arguments对象
2. apply()
apply方法的第一个参数用法和call一样,不同的是第二个参数必须是一个数组
function f(x, y){
console.log(x + y);
}
f.apply(null, [1, 1]) // 2
所以利用这一点
(1)找出数组最大元素
JavaScript 不提供找出数组最大元素的函数。结合使用apply方法和Math.max方法,就可以返回数组的最大元素。
var a = [10, 2, 4, 15, 9];
Math.max.apply(null, a) // 15
(2)将数组的空元素变为undefined
通过apply方法,利用Array构造函数将数组的空元素变成undefined。
Array.apply(null, ['a', ,'b'])
// [ 'a', undefined, 'b' ]
数组的forEach方法会跳过空元素,但是不会跳过undefined。
3. bind()
bind可以绑定this值
var d = new Date();
d.getTime() // 1481869925657
var print = d.getTime;
print() // Uncaught TypeError: this is not a Date object.
这样会报错,可以像下面这样,将getTime内部的this绑定为d对象
var print = d.getTime.bind(d);
print() // 1481869925657
下面这样也是,将inc方法内部的this绑定到counter
var counter = {
count: 0,
inc: function () {
this.count++;
}
};
var func = counter.inc.bind(counter);
func();
counter.count // 1
还可以绑定其他对象
var counter = {
count: 0,
inc: function () {
this.count++;
}
};
var obj = {
count: 100
};
var func = counter.inc.bind(obj);
func();
obj.count // 101
bind还可以绑定原函数的参数
var add = function (x, y) {
return x * this.m + y * this.n;
}
var obj = {
m: 2,
n: 2
};
var newAdd = add.bind(obj, 5); //5相当于绑定了add函数里的x
newAdd(5) // 20,这个5相当于add函数里y
若bind第一个对象为null,等于将this绑定到全局对象(window)
bind的注意事项:
(1)每一次返回一个新函数
bind方法每运行一次,就返回一个新函数,所以监听事件的时候,要谨慎使用。更多
2. 用函数模拟一个类
function Animal(species) { //Animal就是一个对象
this.species = species; //自有属性
}
Animal.prototype = {
constructor: Animal,
walk : function () {}, //走路的代码
run: function () {}, //跑步的代码
eat: function () {}, //吃东西的代码
sleep: function () {} //睡觉的代码
};
let cat = new Animal('cat')
cat.specise === cat //true
//并且cat对象的__proto__指向Animal.prototype,有里面的动作属性
加new的三个作用
- 帮你创建临时对象,用this就可以访问到,比如上面的this.species
- 帮你绑定原型,使Animal里有个隐藏属性__proto__指向Animal.prototype
- 帮你return临时对象Animal.prototype.constructor === Animal
未完待续...