function.apply 如何在 javascript 中工作

Question

我只是在 javascript 中尝试 function.apply()，我无法理解它如何解析我们传入的数组参数。例如，

var update = function(name, profession){
    this.name = name;
    this.profession = profession;
}

var p1 = {
    name : "bond", 
    profession : "actor"
}

console.log(p1.name, p1.profession);  //outputs bond actor

现在让我们使用 apply() 方法更改 p1 的属性

update.apply(p1, ["john", "developer"]);

第一个参数是 this 指针的值，第二个参数是 array

console.log(p1.name, p1.profession);  //outputs john developer

函数update()接受两个参数name和profession，但我只通过apply()方法传入一个array参数["john", "developer"]给它。我不明白我的 update() 方法如何正确地从传入的数组中捕获属性并相应地更新每个属性。

谢谢！

Answer 1

apply 的工作原理是展开数组并将该数组的每个元素作为不同的参数传递。这都是由它们在数组中出现的顺序决定的。

示例：

function printThings(pre, a, b, c) {
  var el = document.querySelector('pre'); // Put the text into an element
  el.innerHTML += pre + '> 1: ' + a + '\n';
  el.innerHTML += pre + '> 2: ' + b + '\n';
  el.innerHTML += pre + '> 3: ' + c + '\n\n';
}

// Calling it normally
printThings('Normal', 'A', 'B', 'C');

// Call using apply
// Notice how the array is in the same order as when we called it normally
printThings.apply(null, ['Apply (1)', 'A', 'B', 'C']);

// Now we'll rearrange the arguments
printThings.apply(null, ['Apply (2)', 'C', 'A', 'B']);

<pre></pre>

还值得一提的是传递给 apply 的第一个参数。在前面的示例中，我传入了 null，因为我根本没有在函数内部使用 this。但如果我是呢？然后我可以将 this 设置为作为第一个参数传递的值。

function printThings(pre) {
  var el = document.querySelector('pre');
  // Here, we expect "this" to be an object with a, b, and c properties
  el.innerHTML += pre + '> A: ' + this.a + '\n';
  el.innerHTML += pre + '> B: ' + this.b + '\n';
  el.innerHTML += pre + '> C: ' + this.c + '\n\n';
}

// Passing in null defaults to using the global context
printThings.apply(null, ['Global']);

// Notice how they're all undefined since there are no a, b, or c properties on the global scope

// But now we'll pass it an object with some values
printThings.apply({
  a: 'A',
  b: 'B',
  c: 'C'
}, ['Matching Values']);

// And just to drill the point home, here's an object with the right properties but different values
printThings.apply({
  a: 'Here',
  b: 'We',
  c: 'Go'
}, ['Different']);

<pre></pre>

工作原理的具体细节取决于您运行使用的 JS 引擎。

function.apply 如何在 javascript 中工作

how function.apply works in javascript

javascript

apply