JavaScript 中的 var 变量是否与此不同

Question

我对术语 var 和在 JavaScript 构造函数中使用关键字 this 声明变量有点困惑。例如，在下面的代码中，var title 是与 happySongs[0].title 不同的变量。它们都用不同的东西初始化。 title 在构造函数中初始化为 song 参数，title 也在构造函数之外初始化。但是，它们都 return 有所不同。如果你打印出 happySongs[0].title 它会给你新的价值。然而，如果你打印出 concat() 方法，标题将不会有 'test' 的新值，而是旧的......所以这里发生了两种不同的事情？这些是单独的变量吗？在函数构造函数中使用 var 和 this 声明变量时有区别吗？

function Tune(song,artist) {
  var title = song;
  this.concat = function() {
   return title + " " + artist;
 }
}

var happySongs = [];
happySongs[0] = new Tune("Putting on the Ritz", "Ella Fitzgerald");

happySongs[0].title = 'test'
//prints out test
console.log(happySongs[0].title); 

 // prints out correct title and artist
console.log(happySongs[0].concat());

Answer 1

var title 是局部变量。 this.concat = function() 然后 "closes" 在 title/artist 变量上。 this.title 和 [0].title 是对象的属性。

Answer 2

它们是不同的。

var title = song;

是构造函数中的局部范围变量。

happySongs[0].title = 'test'

正在构造的 Tune 对象上创建 title 属性。改变一个不会影响另一个。在构造函数中声明的 concat 函数可以访问在外部作用域中声明的局部范围的 title 变量。如果您改为引用 this.title，您将得到属性:

this.concat = function() {
  return this.title + " " + artist;
}

以上内容如果放在您的原始代码中，将导致最后一行：

console.log(happySongs[0].concat());

要输出"test Ella Fitzgerald".

Answer 3

is "var title" a different variable than "happySongs[0].title"

是的，它们是不同的变量。造成混乱的原因，我觉得是在线

happySongs[0].title = 'test'

在执行该行之前，happySongs[0] 没有 public "title" 属性.

当您从 "constructor" 中声明 var title = song 时，您创建了一个局部范围的变量。棘手的部分是，当您创建 concat 函数时，JavaScript 会创建所谓的 "closure"。闭包基本上是一组函数及其环境。为了连接到运行，它需要知道变量 "title" 有什么。因此，无论何时调用 concat，它都会查看该变量。函数何时被调用并不重要，它总是会查看那个局部变量。即使它在技术上 "out of scope"。

调用 happySongs[0].title = 'test' 后，您已经在名为 "test" 的 object 上创建了一个实际的 public 属性。这个属性可以随时从 object 外部访问，但它不会更改 concat 函数，因为 concat 函数在它自己的闭包中（查看局部标题变量）。请注意，如果您将 concat 函数设置为

return this.title + " " + artist;

与 "this" 关键字，然后 concat 函数将查看 object 上的 public 属性（您可以随时更改晚点）。

您可以将 var title = song; 行视为创建 "private" 属性。它只能从 object 中访问。这绝对是一种简化的看待方式。如果您想更多地了解正在发生的事情，则必须了解 JavaScript 作用域和闭包。

http://robertnyman.com/2008/10/09/explaining-javascript-scope-and-closures/

JavaScript 中的 var 变量是否与此不同

Is var variable different from this in JavaScript

javascript

this

javascript-objects

var