JavaScript apply

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply

The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object).

Note: While the syntax of this function is almost identical to that of call(), the fundamental difference is that call() accepts an argument list, while apply() accepts a single array of arguments.

Syntax Section

function.apply(thisArg, [argsArray])

Parameters Section

thisArg
The value of this provided for the call to func. Note that this may not be the actual value seen by the method: if the method is a function in non-strict mode code, null and undefined will be replaced with the global object, and primitive values will be boxed. This argument is not optional
argsArray
Optional. An array-like object, specifying the arguments with which func should be called, or null or undefined if no arguments should be provided to the function. Starting with ECMAScript 5 these arguments can be a generic array-like object instead of an array. See below for browser compatibility information.

Return value Section

The result of calling the function with the specified this value and arguments.

Description Section

You can assign a different this object when calling an existing function. this refers to the current object, the calling object. With apply, you can write a method once and then inherit it in another object, without having to rewrite the method for the new object.

apply is very similar to call(), except for the type of arguments it supports. You use an arguments array instead of a list of arguments (parameters). With apply, you can also use an array literal, for example, func.apply(this, [‘eat‘, ‘bananas‘]), or an Array object, for example, func.apply(this, new Array(‘eat‘, ‘bananas‘)).

You can also use arguments for the argsArray parameter. arguments is a local variable of a function. It can be used for all unspecified arguments of the called object. Thus, you do not have to know the arguments of the called object when you use the apply method. You can use arguments to pass all the arguments to the called object. The called object is then responsible for handling the arguments.

Since ECMAScript 5th Edition you can also use any kind of object which is array-like, so in practice, this means it‘s going to have a property length and integer properties in the range (0..length-1). As an example you can now use a NodeList or a custom object like { ‘length‘: 2, ‘0‘: ‘eat‘, ‘1‘: ‘bananas‘ }.

Most browsers, including Chrome 14 and Internet Explorer 9, still do not accept array-like objects and will throw an exception.

Examples Section

Using apply to append an array to another Section

We can use push to append an element to an array. And, because push accepts a variable number of arguments, we can also push multiple elements at once. But, if we pass an array to push, it will actually add that array as a single element, instead of adding the elements individually, so we end up with an array inside an array. What if that is not what we want? concat does have the behaviour we want in this case, but it does not actually append to the existing array but creates and returns a new array. But we wanted to append to our existing array... So what now? Write a loop? Surely not?

apply to the rescue!

var array = [‘a‘, ‘b‘];
var elements = [0, 1, 2];
array.push.apply(array, elements);
console.info(array); // ["a", "b", 0, 1, 2]

https://www.w3schools.com/js/js_function_apply.asp

Method Reuse

With the apply() method, you can write a method that can be used on different objects.


The JavaScript apply() Method

The apply() method is similar to the call() method (previous chapter).

In this example the fullName method of person is applied on person1:

 var person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person1 = {
  firstName: "Mary",
  lastName: "Doe"
}
person.fullName.apply(person1);  // Will return "Mary Doe" 

The Difference Between call() and apply()

The difference is:

The call() method takes arguments separately.

The apply() method takes arguments as an array.

The apply() method is very handy if you want to use an array instead of an argument list.

The apply() Method with Arguments

The apply() method accepts arguments in an array:

var person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
person.fullName.apply(person1, ["Oslo", "Norway"]);  //这里是一个array参数

Compared with the call() method:

var person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
person.fullName.call(person1, "Oslo", "Norway"); //这里是2个参数

原文地址:https://www.cnblogs.com/chucklu/p/11110507.html

时间: 2024-08-30 06:01:23

JavaScript apply的相关文章

JavaScript apply函数小案例

//回调函数1 function callback(a,b,c) { alert(a+b+c); } //回调函数2 function callback2(a,b) { alert(a+b); } //这个方法做了一些操作.然后调用回调函数 function doCallback(fn,args) { fn.apply(this, args); } function test() { //动态调用方法.并传递参数 doCallback(callback2,['a','b']); doCallba

【转】深入学习JavaScript: apply call方法 详解(转)

Js apply方法详解 原文:http://blog.csdn.net/myhahaxiao/article/details/6952321 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享..  如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.        apply和cal

深入学习JavaScript: apply 方法 详解(转)——非常好

摘自:http://blog.csdn.net/qianzai5765638/article/details/6952321 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享..  如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.        apply和call的区别在哪里 2

JavaScript: apply , call 方法

我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享..  如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.        apply和call的区别在哪里 2.        什么情况下用apply,什么情况下用call 3.        apply的其他巧妙用法(一般在什么情况下

Javascript apply()和call()方法

Javascript内置对象 首先,我从网上查找了apply()和call()的定义.然后用例子解释这两个方法的意思和用法. apply():方法能劫持另一个对象的方法,继承另一个对象的属性. Function.apply(obj,args):方法能接收两个参数 obj:这个对象将代替Function类里this对象 args:这个是数组,它将作为参数传给Function(args-->arguments) 代码示例: <script type="text/javascript&qu

javascript apply,prototype,this,argument

一.apply介绍 1.apply是前端javascript方法默认自带的方法,这要的用法是替换掉当前执行的方法的this对象,从而实现继承,或者修改方法内部使用到this对象: 这次先说继承: 例如: 首先,在test方法里边声明两个方法,add,sub: function test(){ this.add=function(a,b){ return a+b; } this.sub=function(a,b){ return a-b; } } 然后,我们接着定义一个方法test2: funct

深入学习JavaScript: apply 方法 详解

我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享..  如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.        apply和call的区别在哪里 2.        什么情况下用apply,什么情况下用call 3.        apply的其他巧妙用法(一般在什么情况下

javascript apply核心化繁为简

apply是前端javascript方法默认自带的方法,这要的用法是替换掉当前执行的方法的this对象,从而实现继承,或者修改方法内部使用到this对象: 这次先说继承: 例如: 首先,在test方法里边声明两个方法,add,sub: function test(){ this.add=function(a,b){ return a+b; } this.sub=function(a,b){ return a-b; } } 然后,我们接着定义一个方法test2: function test2(){

[每天解决一问题系列 - 0001] Javascript apply和 call对比

相同点: 每个函数都包含这两个原生的方法 他们两个的效果是一样的,用于在特定的作用域下执行函数,本质上是设置函数内this对象的值. 不同点: 传入的参数类型不同 . apply(函数作用域,array[参数]), call(函数作用域,参数1, 参数2, 参数3...). 注意:函数作用域 参数不传或者null,默认为window:在严格模式下则为undefined, 即无效的作用域. 应用场景: 这两个函数最大的作用在于扩充函数赖以运行的作用域,其好处在于对象不需要与方法有任何的耦合关系,用