JavaScript 中 call,apply 和 bind
2024-10-21 05:49:00
call and apply
改变函数内部this的指向(即函数执行时所在的作用域),然后在所指定的作用域中,调用该函数。
function test() {}
test() == test.call() var obj ={};
Object.prototype.toString.call(obj) //"[object Object]"
//因为call 和 apply 会将函数中的this指向第一个参数
上面代码相当于 obj.toString()
1. call 和apply 区别在于传参:
- call 第二个参数开始单个单个参数传
- apply 第二个参数为数组或类数组
var a = [1, 2, 4, 1, 15];
Math.max.apply(null, a) // Math.max.call(null, 1, 2, 4, 16, 15) // //将数组的空元素变为undefined Array.apply(null [1,,3,,4) //[1,undefined,3,undefined,4];
第一个参数为空、null和undefined,则默认传入全局对象。
2. 空元素与undefined的区别
- 数组的 forEach方法会跳过空元素,但是不会跳过undefined。因此,遍历内部元素的时候,会得到不同的结果。
3. 转换类似数组的对象
- 被处理的对象必须有length属性,以及相对应的数字键。
let obj = { 0: 1, length: 2 };
let obj1={ 0: 1,1: 2, length: 2 }; Array.protetype.slice.apply(obj);//[1,undefined] Array.protetype.slice.apply(obj1);//[1,2]
bind方法
用于将函数体内的this绑定到某个对象,然后返回一个新函数。
var counter = {
count: 0,
a: function () {
this.count++;
}
}; var func = counter.a.bind(counter);
func();
counter.count // var add = function (x, y) {
return x * this.m + y * this.n;
} var obj = {
m: 2,
n: 2
}; var newAdd = add.bind(obj, 5); //将x 绑定为 5
newAdd(5) //
newAdd(1,5)//
第一个参数是null或undefined,等于将this绑定到全局对象
bind方法使用注意点
- bind方法每运行一次,就返回一个新函数, 需要一个变量接收
- 结合回调函数使用
var counter = {
count: 0,
inc: function () {
'use strict';
this.count++;
}
}; function callIt(callback) {
callback();
} callIt(counter.inc.bind(counter));
counter.count //
结合call方法使用
1. 正常使用slice
[1, 2, 3].slice(0, 2) // [1,2]
// 等同于
Array.prototype.slice.call([1, 2, 3], 0, 2) // [1,2]
2. 将Array.prototype.slice变成Function.prototype.call方法所在的对象,调用时就变成了Array.prototype.slice.call。
var slice = Function.prototype.call.bind(Array.prototype.slice);
Function.prototype.slice.call([1, 2, 3], 0, 1) // [1]
//slice([1, 2, 3], 0, 1)
3. 类似的写法还可以用于其他数组方法。
var push = Function.prototype.call.bind(Array.prototype.push);
var pop = Function.prototype.call.bind(Array.prototype.pop); var a = [1 ,2 ,3];
push(a, 4)
a // [1, 2, 3, 4] pop(a)
a // [1, 2, 3]
4. 将Function.prototype.bind方法变成Function.prototype.call的方法,就意味着bind的调用形式也可以被改写
function f() {
console.log(this.v);
} var o = { v: 123 };
var bind = Function.prototype.call.bind(Function.prototype.bind);
bind(f, o)() //
最新文章
- [Erlang 0123] Erlang EPMD
- SQL查询一个月第一天/最后一天及日期格式化
- java接口的应用举例
- oracle触发器设置uuid变量
- List的遍历和删除元素
- php遍历mysql资源
- linux 声音大小调整的命令
- @SuppressWarnings(unchecked)作用解释
- qt动态更新界面的菜鸟代码,请指出
- Cocos2dx3.4 VS2013无法打开包括文件extensions/ExtensionExport.h解决的方法
- monkeyrunner_控件坐标获取
- mahout系列----minhash聚类
- Angularjs 跨域请求
- 大牛总结的Linux提权Exp合集
- Python Web学习笔记之并发和并行的区别和实现
- WPF 的 ElementName 在 ContextMenu 中无法绑定成功?试试使用 x:Reference!
- Ubuntu 14.04 开机手动开启numlock led
- BFC以及margin的深入探究
- mock.js中新增测试接口无效,返回404
- MOS管学习笔记
热门文章
- 关于Login failed. The login is from an untrusted domain and cannot be used with Windows authentication.的问题
- P4338 [ZJOI2018]历史 LCT+树形DP
- 使用between and 作为查询条件
- adminLte 解决菜单栏 bug
- BestCoder Round #64 1001
- linux dns高速缓存
- 基于python检测端口是否在使用
- spring boot——常用注解
- JS数组去重总结
- JMeter 正则表达式提取器(二)