Javascript基础知识学习-4

新的对象属性和方法

Object.defineProperty() 是 ES5 中的新对象方法。

它允许您定义对象属性和/或更改属性的值和/或元数据。

// 创建对象：
var person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "NO", 
};

// 更改属性：
Object.defineProperty(person, "language", {
  value: "EN",
  //是否可以写入
  writable : true,
  //
  enumerable : true,
  configurable : true
});

此例创建一个 setter 和 getter 来确保语言的大写更新：

// 创建对象：
var person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "NO"
};

// 更改属性：
Object.defineProperty(person, "language", {
  get : function() { return language },
  set : function(value) { language = value.toUpperCase()}
});

ES5 新的对象方法

ECMAScript 5 为 JavaScript 添加了许多新的对象方法：

// 添加或更改对象属性
Object.defineProperty(object, property, descriptor)

// 添加或更改多个对象属性
Object.defineProperties(object, descriptors)

// 访问属性
Object.getOwnPropertyDescriptor(object, property)

// 将所有属性作为数组返回
Object.getOwnPropertyNames(object)

// 将可枚举属性作为数组返回
Object.keys(object)

// 访问原型
Object.getPrototypeOf(object)

// 防止向对象添加属性
Object.preventExtensions(object)

// 如果可以将属性添加到对象，则返回 true
Object.isExtensible(object)

// 防止更改对象属性（而不是值）
Object.seal(object)

// 如果对象被密封，则返回 true
Object.isSealed(object)

// 防止对对象进行任何更改
Object.freeze(object)

// 如果对象被冻结，则返回 true
Object.isFrozen(object)

ECMAScript 2017 中的新特性

本章介绍 ECMAScript 2017 的新特性：

• JavaScript 字符串填充
• JavaScript Object.entries
• JavaScript Object.values
• JavaScript 异步函数
• JavaScript 共享内存

JavaScript 字符串填充

ECMAScript 2017 添加了两个 String 方法：padStart 和 padEnd，以支持在字符串的开头和结尾进行填充。

let str = "5";
str = str.padStart(4,0);
// 结果是： 0005

let str = "5";
str = str.padEnd(4,0);
// 结果是： 5000

Internet Explorer 不支持字符串填充。

Firefox 和 Safari 是第一批支持 JavaScript 字符串填充的浏览器：

Chrome	IE	Firefox	Safari	Opera
Chrome 57	Edge 15	Firefox 48	Safari 10	Opera 44
2017 年 3 月	2017 年 4 月	2016 年 8 月	2016 年 9 月	2017 年 3 月

JavaScript 对象条目

ECMAScript 2017 向对象添加了新的 Object.entries 方法。

Object.entries() 方法返回对象中键/值对的数组：

实例

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
//firstName,Bill,lastName,Gates,age,50,eyeColor,blue
document.getElementById("demo").innerHTML = Object.entries(person);

Object.entries() 使循环中使用对象变简单了：

const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
    text += fruit + ": " + value + "<br>";
}
  /*
    Bananas: 300
    Oranges: 200
    Apples: 500
    */
document.getElementById("demo").innerHTML = text

Object.entries() 也使得将对象转换为映射变得简单：

const fruits = {Bananas:300, Oranges:200, Apples:500};

const myMap = new Map(Object.entries(fruits));

Chrome 和 Firefox 是第一批支持 Object.entries 的浏览器：

Chrome	IE	Firefox	Safari	Opera
Chrome 47	Edge 14	Firefox 47	Safari 10.1	Opera 41
2016 年 6 月	2016 年 8 月	2016 年 6 月	2017 年 3 月	2016 年 10 月