The difference between call () and apply ()

Source: Internet
Author: User
<span id="Label3"></p><p><p>call <strong>method:</strong><br>Syntax: call ([thisobj[,arg1[, arg2[, [,. argN]]])<br>Definition: invokes one method of an object, replacing the current object with another Object.<br>Description<br>The call method can be used to invoke a method in place of another object. The call method can change the object context of a function from the initial context to a new object specified by thisobj.<br>If the thisobj parameter is not provided, then the Global object is used as the thisobj.<br><br><strong>Apply Method:</strong><br>Syntax: Apply ([thisobj[,argarray]])<br>Definition: a method of applying an object that replaces the current object with another Object.<br>Description<br>If Argarray is not a valid array or is not a arguments object, it will result in a TypeError.<br>If none of the Argarray and thisobj parameters are provided, then the Global object is used as a thisobj and cannot be passed any Parameters.</p></p><p><p></p></p><p><p>Instance:</p></p> <ol class="dp-j" start="1"> <ol class="dp-j" start="1"> <li>function Add (a, b)</li> <li>{</li> <li>Alert (a+b);</li> <li>}</li> <li>function Sub (a, b)</li> <li>{</li> <li>Alert (a-b);</li> <li>}</li> <li></li> <li>Add.call (sub,<span class="number">3,<span class="number">1); </span></span></li> <li><span class="number">The meaning of this example is to replace sub,add.call (sub,3,1) = = Add (3,1) with add, so the result is: alert (4); Note: the function in JS is actually an object, and the function name is a reference to a function object.</span></li> </ol> </ol><p><p></p></p> <ol class="dp-j" start="1"> <li><li>function Animal () {</li></li> <li><li><span class="keyword">this.name = <span class="string">"Animal"; </span></span></li></li> <li><li><span class="keyword">This.showname = function () {</span></li></li> <li><li>Alert (<span class="keyword">this.name); </span></li></li> <li><li>}</li></li> <li><li>}</li></li> <li><li></li></li> <li><li>function Cat () {</li></li> <li><li><span class="keyword">this.name = <span class="string">"Cat"; </span></span></li></li> <li><li>}</li></li> <li><li></li></li> <li><li>var animal = <span class="keyword">new Animal (); </span></li></li> <li><li>var cat = <span class="keyword">New Cat (); </span></li></li> <li><li></li></li> <li><li><span class="comment">Using the call or Apply method, the ShowName () method that originally belonged to the animal object is given to the object cat.</span></li></li> <li><li><span class="comment">The input result is "Cat"</span></li></li> <li><li>Animal.showName.call (cat,<span class="string">","); </span></li></li> <li><li><span class="comment">Animal.showName.apply (cat,[]);</span></li></li> </ol><p><p><span class="comment">Another example:</span></p></p><p><p>function Animal () {</p></p><p><p><span class="keyword">THIS.name = <span class="string">"Animal"; </span></span></p></p><p><p><span class="keyword">This.showname = function () {</span></p></p><p><p>Alert (<span class="keyword">this.name); </span></p></p><p><p>}</p></p><p><p>}</p></p><p><p>function Cat () {</p></p><p><p><span class="keyword">THIS.name = <span class="string">"Cat"; </span></span></p></p><p><p>}</p></p><p><p>var animal = <span class="keyword">new Animal (); </span></p></p><p><p>var cat = <span class="keyword">New Cat (); </span></p></p><p><p><span class="comment">Using the call or Apply method, the ShowName () method that originally belonged to the animal object is given to the object cat.</span></p></p><p><p><span class="comment">The input result is "Cat"</span></p></p><p><p>Animal.showName.call (cat,<span class="string">",");  </span> <span class="comment">//animal.showname.apply (cat,[]); </span></p></p><p><p><span class="comment" style="color: #ff0000;">Call means to put the animal method on the cat, the original cat is no showname () method, now is to put animal showname () method on the cat to execute, so this.name should be cat</span></p></p><p><p><span class="comment">To implement Inheritance:</span></p></p> <ol class="dp-j" start="1"> <li><li>function Animal (name) {</li></li> <li><li><span class="keyword">this.name = name; </span></li></li> <li><li><span class="keyword">This.showname = function () {</span></li></li> <li><li>Alert (<span class="keyword">this.name); </span></li></li> <li><li>}</li></li> <li><li>}</li></li> <li><li></li></li> <li><li>function Cat (name) {</li></li> <li><li>Animal.call (this<span class="keyword">, name); </span></li></li> <li><li>}</li></li> <li><li></li></li> <li><li>var cat = <span class="keyword">New Cat (<span class="string">"Black cat"); </span></span></li></li> <li><li>Cat.showname ();</li></li> </ol><p><p><span style="color: #ff0000;">Animal.call (this) means that the Animal object is used instead of the this object, so there is no Animal of all the properties and methods in cat, and the Cat object can directly invoke the Animal method and Properties.</span></p></p><p><p></p></p><p><p><span class="comment">To implement multiple inheritance:</span></p></p> <ol class="dp-j" start="1"> <li><li>function Class10 ()</li></li> <li><li>{</li></li> <li><li><span class="keyword">this.showsub = function (a, b)</span></li></li> <li><li>{</li></li> <li><li>Alert (a-b);</li></li> <li><li>}</li></li> <li><li>}</li></li> <li><li></li></li> <li><li>function Class11 ()</li></li> <li><li>{</li></li> <li><li><span class="keyword">this.showadd = function (a, b)</span></li></li> <li><li>{</li></li> <li><li>Alert (a+b);</li></li> <li><li>}</li></li> <li><li>}</li></li> <li><li></li></li> <li><li>function Class2 ()</li></li> <li><li>{</li></li> <li><li>Class10.call (this<span class="keyword">); </span></li></li> <li><li>Class11.call (this<span class="keyword">); </span></li></li> <li><li>}</li></li> </ol><p><p><span style="color: #ff0000;">simple, using two call to achieve multiple inheritance</span><br><span style="color: #ff0000;">of course, JS inheritance There are other methods, such as the use of prototype chain, this is not part of the scope of this article, just here to illustrate the use of Call. Said call, of course, and apply, These two methods are basically a meaning, the difference is that the second parameter of call can be any type, and the second argument of apply must be an array, or it can be arguments</span></p></p><p><p></p></p><p><p>The difference between call () and apply ()</p></p></span>
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.