学习 js 之 apply() 和 call() 方法

call():将某个实例的数据 调用 某个对象或函数的方法,一般原方法默认带返回值,可多个参数。
call():我查到的中文意思是传呼,翻译成调用,比较让我容易记忆。
apply():将某个对象或函数方法 应用到 某些实例元素,only 数组。就两个参数。
apply():明显是一个应用,是强制型的,所以数组更适合它,也是方便记忆而已。

var person = {
    fullName : function(){
        return this.firstName + " " + " " + this.lastName;
    }
}
var person1 = {
    firstName : "Firssss",
    lastName : "Lastttttt"
}
var person2 = {
    firstName : "Firssss2222",
    lastName : "Lastttttt2222"

//将 person1的实例数据 调用 person.fullName()方法,该方法默认带一个返回值
//返回值是一条语句字符串。
var sentence = person.fullName.call(person1);
alert(sentence)
var sentence2 = person.fullName.call(person2);
alert(sentence2)   

call():可以接受参数时。

var person = {
    fullName : function(city,country){
        // var city,country;
        return this.firstName + " " + this.lastName + " " + city + " " + country;
    }
}
var person1 = {
    firstName: "Yamaha",
    lastName:"Yadi"
}
var result = person.fullName.call(person1,"Seattle","Japanese")
alert(result)

apply():关于上面的使用不做介绍,一样。

var person = {
    fullName : function(city,country){
        return this.firstName + " " + this.lastName + " " + city + " " + country;
    }
}
var person1 = {
    firstName : "Firssss",
    lastName : "Lastttttt"
}
// var result = person.fullName.apply(person1,['Beijing','shijianzhuang'])
var result = person.fullName.call(person1,'Beijing','shijianzhuang')//直接传数组返回 undefined
alert(result)

call中对指针的解读:

/*测试this指针的问题*/
function add(param1,param2){
    console.log(this);
    return (this.a + this.b) + "\<br\>" + param1 + param2;
}
function sub(param1,param2){
    console.log(this);
    return (this.a - this.b) + "pppppp" + param1 + param2;
}
var num1 = {
    a:1,
    b:2
}
var result = add.call(num1,"传过去参数,","不知何用?");
//add中的this指向了该num1对象;{a: 1, b: 2}
var result = add.call(add,"传过去参数,","不知何用?");
//此时的add函数中打印出来的this,指向函数自己;f 函数书写体。
var result = add.call(sub,1,2); 
//解释:将sub函数作为参数 调用 add的方法,该方法返回一个字符串
//add函数中的this指向着 sub 函数,打印出 sub 函数体。
var result = sub.call(add,1,2);
//解释:sub函数的this指针 &rarr; add 函数,打印出 add 函数体。
console.log(result);

继承自其它对象的属性,加入到自己内部:

/*继承来自于其他对象的属性*/
function People(name,age){
    this.name = name;
    this.age = age;
    console.log(this);
    //此时的People()构造函数,已经被实例化;
    //数据来源是call()括号里面的数据参数
    //而数据参数在Student构造器并没有找到
    //后面有实例化该语句,也就等于student实例延长了自己的作用域 至 People 构造器
    //student 既拥有People构造器的全部属性,也拥有自己独有属性 grade
}
function Student(name,age,grade){
    People.call(this,name,age);
    this.grade = grade;
}
var student = new Student("小明",21,"大三");
console.log(student.name + student.age + student.grade);

数组,两个数组的操作,这时候apply用上了。

var arr1 = [1,2,3];
var arr2 = [4,5,6];
Array.prototype.push.apply(arr1,arr2);
//第一个是要应用于的对象,目标对象。第二个是数据来源
console.log(arr1);//[1,2,3,4,5,6]
console.log(arr2);//[4,5,6]

var arr1 = [1,2,3];
var arr2 = [1,5,6];
Array.prototype.pop.apply(arr1);//删除最后一个数组,返回新数组。[1,2]
Array.prototype.push.apply(arr1,arr2);//[1,2,1,5,6]
console.log(arr1);//[1,2,1,5,6]