call & apply & bind方法,调用一个函数,并具有一个指定的this值。
不同点:
1、call和bind 第一个参数为this,后面跟一个传值列表。
2、apply第一个参数为this,第二个参数为传值数组。
3、call和apply 直接执行,bind返回一个函数,需手动执行。
使用选择:
1、参数为数组格式时,用apply方法。
2、需要延后执行时,用bind方法。
基础用法:
var a = {}; var b = {}; var c = {}; function d(x, y) { this.x = x; this.y = y; } d.call(a, 1, 2); // 列表 d.apply(b, [3, 4]); // 数组 d.bind(c, 5, 6)(); // 不直接执行 console.log(a); // {x: 1, y: 2} console.log(b); // {x: 3, y: 4} console.log(c); // {x: 5, y: 6}
用途:
1、类的继承
function Life(status) { // 生命 this.status = status; } function Proson(name, age, status) { // 人 this.name = name; this.age = age; Life.call(this, status); } function Student(name, age, status, grade) { // 学生 this.grade = grade; Proson.call(this, name, age, status); } var xiaoMing = new Student(‘小明‘, 18, ‘活着‘, ‘大一‘); // "活着的小明,他今年18岁,上大一了。" console.log(xiaoMing.status+‘的‘+xiaoMing.name+‘,他今年‘+xiaoMing.age+‘岁,上‘+xiaoMing.grade+‘了。‘);
2、回掉函数(定时器 | ajax | ... )
var a = { ‘x‘ : 1, ‘y‘ : function () { setTimeout(function() { console.log(this.x); // this指向window }); }, ‘z‘ : function () { setTimeout(function() { console.log(this.x); // this指向a }.call(this)); } } console.log(a.y()); // undefined console.log(a.z()); // 1
3、内置函数
var arr = [5,9,2,7,12,3]; Math.min.apply(null, arr); // 2 Math.max.apply(null, arr); // 12
注意: 当参数过多(比如超过1w个),可能会参数个数越界,建议切块后执行。(js中最大参数个数65536个)
function minOfArray(arr) { var min = Infinity; var QUANTUM = 32768; for (var i = 0, len = arr.length; i < len; i += QUANTUM) { var submin = Math.min.apply(null, arr.slice(i, Math.min(i + QUANTUM, len))); min = Math.min(submin, min); } return min; } var min = minOfArray([5, 6, 2, 3, 7]);
4、伪数组转数组
var a = { 0: 1, 1: 2, length: 2 } Array.prototype.slice.call(a); // [1, 2] var b = []; b.slice.call(a); // [1, 2] Array.from(a); // [1, 2] Es6