Home > Web Front-end > JS Tutorial > body text

Detailed explanation of how to use call and apply to implement inheritance in javascript

伊谢尔伦
Release: 2017-07-20 15:02:30
Original
1836 people have browsed it

Both call and apply in js can be inherited. The only parameter difference is that the apply corresponding to func.call(func1,var1,var2,var3) is written as: func.apply(func1,[var1,var2 ,var3]).

Explanation of call in the JS manual:

call method
Call a method of an object to Another object replaces the current object.

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])
Copy after login

Parameters
thisObj
Optional. The object that will be used as the current object.

arg1, arg2, , argN
Optional. A sequence of method parameters will be passed.

Description
The call method can be used to call a method instead of another object. The call method changes the object context of a function from the initial context to the new object specified by thisObj.

If the thisObj parameter is not provided, the Global object is used as thisObj.

To put it simply, the function of these two functions is actually to change the internal pointer of the object, that is, to change the content pointed to by this of the object. This is sometimes useful in object-oriented js programming. Let's take apply as an example to talk about the important role of these two functions in js. For example:

<SPAN style="FONT-SIZE: 18px"> function Person(name,age){   //定义一个类   
        this.name=name;     //名字   
        this.age=age;       //年龄   
        this.sayhello=function(){alert(this.name)};  
    }  
    function Print(){            //显示类的属性   
        this.funcName="Print";  
        this.show=function(){  
            var msg=[];  
            for(var key in this){  
                if(typeof(this[key])!="function"){  
                    msg.push([key,":",this[key]].join(""));  
                }  
            }  
            alert(msg.join(" "));  
        };  
    }  
    function Student(name,age,grade,school){    //学生类   
        Person.apply(this,arguments);//比call优越的地方   
        Print.apply(this,arguments);  
        this.grade=grade;                //年级   
        this.school=school;                 //学校   
    }  
    var p1=new Person("开化",80);  
    p1.sayhello();  
    var s1=new Student("云飞",40,9,"岳麓书院");  
    s1.show();  
    s1.sayhello();  
    alert(s1.funcName);</SPAN>
Copy after login

In addition, Function.apply() plays a prominent role in improving program performance:
Let’s start with the Math.max() function. Math.max can be followed by any number of parameters. , and finally returns the maximum value among all parameters.
For example

<SPAN style="FONT-SIZE: 18px">alert(Math.max(5,8));   //8   
    alert(Math.max(5,7,9,3,1,6));   //9   
    //但是在很多情况下,我们需要找出数组中最大的元素。   
    var arr=[5,7,9,1];  
    //alert(Math.max(arr));    // 这样却是不行的。NaN   
    //要这样写   
    function getMax(arr){  
        var arrLen=arr.length;  
        for(var i=0,ret=arr[0];i<arrLen;i++){  
            ret=Math.max(ret,arr[i]);  
        }  
        return ret;  
    }  
    alert(getMax(arr)); //9   
    //换用apply,可以这样写   
    function getMax2(arr){  
        return Math.max.apply(null,arr);  
    }  
    alert(getMax2(arr)); //9   
    //两段代码达到了同样的目的,但是getMax2却优雅,高效,简洁得多。   
    //再比如数组的push方法。   
    var arr1=[1,3,4];  
    var arr2=[3,4,5];  
    //如果我们要把 arr2展开,然后一个一个追加到arr1中去,最后让arr1=[1,3,4,3,4,5]   
    //arr1.push(arr2)显然是不行的。 因为这样做会得到[1,3,4,[3,4,5]]   
    //我们只能用一个循环去一个一个的push(当然也可以用arr1.concat(arr2),但是concat方法并不改变arr1本身)   
    var arrLen=arr2.length;  
    for(var i=0;i<arrLen;i++){  
        arr1.push(arr2[i]);  
    }  
    //自从有了Apply,事情就变得如此简单   
    Array.prototype.push.apply(arr1,arr2); //现在arr1就是想要的结果</SPAN>
Copy after login


The above is the detailed content of Detailed explanation of how to use call and apply to implement inheritance in javascript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template