ECMAScript 之 Object Property 存取

栏目: JavaScript · 发布时间: 6年前

内容简介：與傳統 OOP 相比， ECMAScript 的 Object 有一個很特別的語言特性，就是 Property 可以透過 Array 與ECMAScript 5

與傳統 OOP 相比， ECMAScript 的 Object 有一個很特別的語言特性，就是 Property 可以透過 Array 與 變數 方式存取，這造成了使用 Object 有很大的靈活度。

Version

ECMAScript 5

Array 方式存取 Property

var person = {
  firstName: 'Sam',
  lastName: 'Xiao',
  fullName: function() {
    return this.firstName + ' ' + this.lastName;
  }
};

console.log(person.firstName); // Sam
console.log(person.fullName()); // Sam Xiao

console.log(person['firstName']); // Sam
console.log(person['fullName']()); // Sam Xiao

person 為 object，有 property 也有 method。

第 9 行

console.log(person.firstName);
console.log(person.fullName());

為傳統 OOP 使用 . 方式純取 property 與 method。

第 12 行

console.log(person['firstName']); // Sam
console.log(person['fullName']()); // Sam Xiao

ECMAScript 允許我們以 array 方式存取 property 與執行 method，將 property 與 method 名稱以 string 傳入 [] 即可。

這樣有什麼用呢 ?

既然 [] 可為 string，就表示可以是 variable，這就開了一個很大的門。

以 Variable 存取 Property

var person = {
  firstName: 'Sam',
  lastName: 'Xiao',
  fullName: function() {
    return this.firstName + ' ' + this.lastName;
  }
};

const getProperty = (object, propertyName) =>
  object[propertyName];

console.log(getProperty(person, 'firstName')); // Sam
console.log(getProperty(person, 'lastName')); // Xiao

Property 名稱可改用 function 的 argument 傳入，如此就能以 variable 的方式存取 property。

ECMAScript 之 Object Property 存取

object 與 property 名稱都以 argument 方式傳入

以 Variable 執行 Method

var person = {
  firstName: 'Sam',
  lastName: 'Xiao',
  fullName: function() {
    return this.firstName + ' ' + this.lastName;
  }
};

const runMethod = (object, methodName) =>
  object[methodName]();

console.log(runMethod(person, 'fullName')); // Sam Xiao

Method 名稱可改用 function 的 argument 傳入，如此就能以 variable 的方式執行 function。

ECMAScript 之 Object Property 存取

object 與 method 名稱都以 argument 方式傳入

Conclusion

當 property 與 method 名稱能使用變數後，就能以程式碼的方式做很多變化，動態的存取 property 與執行 method

以上所述就是小编给大家介绍的《ECMAScript 之 Object Property 存取》，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对码农网的支持！

查看所有标签

猜你喜欢:

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。

码农书籍

Domain-Driven Design

Eric Evans / Addison-Wesley Professional / 2003-8-30 / USD 74.99

"Eric Evans has written a fantastic book on how you can make the design of your software match your mental model of the problem domain you are addressing. "His book is very compatible with XP. It is n......一起来看看《Domain-Driven Design》这本书的介绍吧!

码农工具