JavaScript学习(2)call&apply&bind&eval用法

时间:2021-04-08 21:38:46

javascript学习(2)call&apply&bind&eval用法

在javascript中存在这样几种特别有用的函数,能方便我们实现各种奇技淫巧。其中,call、bind、apply能改变函数运行时的上下文,或者说动态改变函数内部的this指向的作用,这就给我们使用时提供了极大的灵活性。而eval可以将传入的字符串当作JavaScript代码执行。本文,简单的介绍下其中的用法。

1. call

含义:

Function.prototype.call()

可知它是Function原型的一个方法,它本身会调用另外一个函数,并接收指定的this值和参数列表。也可以理解为,call()方法中接收的对象调用当前对象所拥有的函数,而返回值则是该调用方法的返回值。

用法:

fun.call(thisObj, arg1, arg2, ...)

以上,会将fun的上下文对象this修改为thisObj,并将可选参数arg1,arg2等当作参数传递给fun函数。

示例:

var student = {
name: "张三",
age: 18,
getInfo: function(desc) {
console.log(desc + "," + this.name + "," + this.age);
}
} var xiaoming = {
name: "小明",
age: 20,
} student.getInfo.call(xiaoming); // welcome,小明,20

2. apply

Function.prototype.apply()

应该说apply方法跟call方法的作用类似,只是apply接收的参数是指定的this值和一个包含多个参数的数组作为参数列表,而call是接受若干个参数的列表。

用法:

fun.apply(thisObj, [argsArray])

注意,argsArray是一个数组或者类数组对象。

示例:

var student = {
name: "张三",
age: 18,
getInfo: function(desc) {
console.log(desc + "," + this.name + "," + this.age);
}
} var xiaoming = {
name: "小明",
age: 20,
} student.getInfo.apply(xiaoming, ["welcome"]); //welcome,小明,20

3. bind

Function.prototype.bind()

bind方法会创建一个新的函数,并将原函数this的值绑定为当前指定的对象,返回由指定this值和初始化参数的原函数的拷贝。

用法:

fun.bind(thisObj[, arg1[, arg2[, ...]]])

即:将fun函数的this值指定为thisObj,并将参数列表arg1,arg2等传递给该函数所创建的一个新的函数。

示例:

var student = {
name: "张三",
age: 18,
getInfo: function(desc) {
console.log(desc + "," + this.name + "," + this.age);
}
} var xiaoming = {
name: "小明",
age: 20,
} var getInfo2 = student.getInfo.bind(xiaoming, "welcome");
getInfo2(); // welcome,小明,20
console.log(getInfo2); // [Function: bound getInfo]

4. eval

eval()函数,是全局对象的一个函数属性。该函数接受一个字符串参数,并会当作javascript代码来执行,如果接受的不是字符串参数,则原样返回。

用法:

eval(string)

示例:

console.log(eval("new Date()"));    // 2017-12-09T08:45:23.759Z
console.log(eval(false)); // false

以上几个是日常开发可能会用到的高级用法,但不限于这些,这里只是也做了简单的介绍,主要是促进对javascript的使用与理解,更多后续的使用会陆续更新。