apply和call 的使用
// apply和call都可以改变this的指向
function f1(x, y) {
console.log("结果是:" + (x + y) + this);
}
window.f1(10, 20); //this是window
function f1(x, y) {
console.log((x + y) + ":===>" + this);
return "这是函数的返回值";
}
// apply 和call 调用
var r1 = f1.apply(null, [1, 2]); //此时f1中的this就是window
console.log(r1);
var r2 = f1.call(null, 1, 2); //此时f1中的this也是window
console.log(r2);
// 改变this的指向
var obj = {
sex: "男"
};
var r3 = f1.apply(obj, [1, 2]);
console.log(r3);
var r4 = f1.call(obj, 1, 2);
console.log(r4);
apply和call的使用方法
- apply的使用语法：
函数名字.apply(对象,[参数1,参数2,...]);
方法名字.apply(对象,参数1,参数2,...); - call的使用语法
函数名字.call(对象,[参数1,参数2,...]);
方法名字.call(对象,参数1,参数2,...); - 作用：改变this的指向
- 不同的地方：
参数传递的方式不一样只要是想使用对象的方法，并且希望这个方法是当前对象的，那么就可以使用apply或call的方法改变this的指向 - apply和call方法实际上并不在函数这个实例对象中，而是在Function的prototype中
bind方法
bind方法是复制的意思,参数可以在复制的时候传进去,也可以在复制之后调用的时候传进去
- 使用的语法：
函数名字.bind(对象,参数1,参数2,...); =========>返回值是复制之后的这个函数
方法名字.bind(对象,参数1,参数2,...);=========>返回值是复制之后的这个方法
<script type="text/javascript">
function f1(x, y) {
console.log((x + y) + "=========" + this);
}
// bind方法是复制的意思,参数可以在复制的时候传进去,
// 也可以在复制之后调用的时候传进去
var ff = f1.bind(null, 10, 20);
ff(10, 30);
function Person() {
this.age = 1000;
}
Person.prototype.eat = function() {
console.log("哇咔咔");
};
var per = new Person();
var f2 = f1.bind(per, 10, 20);
f2();
Person.prototype.play = function() {
console.log(this + "=====" + this.age);
};
function Student(age) {
this.age = age;
};
var per = new Person(10);
var stu = new Student(20);
// 复制了一份
var ff = per.play.bind(stu);
ff();//20 是学生的
// bind是用来复制一份
bind方法的使用
案例:
<script type="text/javascript">
// 展示随机数
function ShowRandom() {
// 1-10的随机数
this.number = parseInt(Math.random() * 10 + 1);
}
ShowRandom.prototype.show1 = function() {
window.setInterval(this.show2.bind(this), 1000);
};
ShowRandom.prototype.show2 = function() {
// 展示随机数
console.log(this.number);
}
var sr = new ShowRandom();
// 调用这个方法一次,可以不停的产生随机数
sr.show1();
</script>
函数中的几个成员
函数中的属性：
name:函数的名字，name属性是只读的，不能修改arguments：实参的个数length：函数定义时候形参的个数caller：调用(f1函数是在f2中调用的)
function f1(x, y) {
console.log(f1.name);
console.log(f1.arguments.length);
console.log(f1.length);
console.log(f1.caller);
}
f1.name = "个个矮柜 ";
f1(10, 20, 30, 40);
console.dir(f1);
function f2() {
console.log("f2的函数");
f1(1, 2);
};
f2();
高阶函数之作为参数使用
函数作为参数的时候,如果是命名函数, 那么只传入函数的名字,没有括号
<script type="text/javascript">
function f1(fn) {
console.log("f1的函数");
fn();
}
// fn是函数,最后作为函数使用了,函数是可以作为参数使用
// 传入匿名函数
f1(function() {
console.log("这是匿名函数");
});
// 命名函数
function f2() {
console.log("f2的函数");
}
f1(f2);
// 函数作为参数的时候,如果是命名函数,
// 那么只传入函数的名字,没有括号
</script>
高阶函数之作为返回值使用
案例：
<script type="text/javascript">
function f1() {
console.log("f1函数开始");
return function() {
console.log("这是函数，但是此时作为返回值使用")
};
}
var ff = f1();
ff();
var num = 10;
console.log(typeof num); //获取num这个变量的数据类型
var obj = {};
console.log(obj instanceof Object); //判断这个对象是不是某个类型的
//此时输出的是Object的数据类型 [object Object]
console.log(Object.prototype.toString());
// 输出的数组的数据类型 [object Array]
console.log(Object.prototype.toString.call([]));
var arr = [10, 20, 30];
console.log(Object.prototype.toString.call(arr));
console.log(Object.prototype.toString.call(new Date()));
// 获取某个对象的类型是不是你传入的类型
// type:是变量,是参数, "[object Array]"
// obj: 是变量,是参数, [10,20,30];
function getFunc(type) {
return function(obj) {
return Object.prototype.toString.call(obj) == type;
}
}
var ff = getFunc("[object Array]");
var result = ff([10, 20, 30]);
console.log(result);
</script>
网友评论