ES6(四)扩展的对象功能1
1.对象类别(普通、标准、内置)
2.对象字面量语法的扩展
(属性名与值相同可以只写一个;
对象里面的方法简写var obj = { sayNane() {…} };
获取对象里面属性的名字,写入对象名字,的一些方式[]
)
3.新的方法
Object.is(num1, num2),即使是特殊情况(+0 、-0)也比===更准确一些,一般情况下还是使用===
Object.assign() 将一个对象的属性赋值给另一个对象
1.对象类别
对象类别包括:
普通对象:拥有 JS 对象所有默认的内部行为。 奇异对象:其内部行为在某些方面有别于默认行为。
标准对象:在 ES6 中被定义的对象,例如 Array 、 Date ,等等。标准对象可以是普通的,也可以是奇异的。
内置对象:在脚本开始运行时由 JS 运行环境提供的对象。所有的标准对象都是内置对象。
2.对象字面量语法的扩展
对象字面量, 是一种创建对象的简洁语法(否则 要多写不少代码).
ES6 用几种方式扩展了对象字面量:
a. 属性初始化器的速记法
// ES5
// 对象字面量是“键/值对”的简单集合。
// 属性值被初始化时可能会有些重复
function createPerson(name, age) {
return {
name: name,
age: age
};
}
// ES6
function createPerson(name, age) {
return {
name,
age
};
}
b. 方法简写
// ES5
var person = {
name: "Nicholas",
sayName: function() {
console.log(this.name);
}
};
// ES6
var person = {
name: "Nicholas",
sayName() {
console.log(this.name);
}
};
person.sayName();
c. 需计算属性名
var person = {},
lastName = "last name";
person["first name"] = "Nicholas";
person[lastName] = "Zakas";
console.log(person["first name"]); // Nicholas
console.log(person[lastName]); // Zakas
方括号表示法允许将任意字符串用作属性名.
"first name" 与 "last name" 属性就能分别被赋值为 "Nicholas" 与 "Zakas" 。
也可以,字符串字面量直接用作属性:
var person = {
"first name": "Nicholas"
};
console.log(person["first name"]); // Nicholas
var param0 = 'last name';
var persong = {
'first name': 'zhang',
param: 'san',
[param0]: 'sansan'
};
console.log(persong['first name']);
console.log(persong['param'] );
console.log(persong['last name']);
console.log(persong[param0]);
如果属性名有字符串,也同理:
var suffix = " name";
var person = {
["first" + suffix]: "Nicholas",
["last" + suffix]: "Zakas"
};
console.log(person["first name"]);
console.log(person["last name"]);
新的方法
引入了两个新方法, 避免在 Object 对象的原型上 添加新方法,
尝试寻找哪些对象应该被添加新方法.
a. Object.is()方法
相等运算符( == )或严格相等运算符( ===)
为了避免在比较时发生强制类型转换,许多开发者更倾向于使用后者.
但是也并不完全准确.
它认为 +0 与 -0 相等,即使这两者在 JS 引擎中有不同的表 示;
另外NaN === NaN 会返回 false ,因此有必要使用isNaN() 函数来正确检测 NaN 。
所以, ES6引入了 Object.is() 方法来弥补严格相等运算符残留的怪异点。
接收两个参数,
会在二者的值相等时返回 true 。
(要求二者类型相同并且值也相等)
console.log(+0 == -0); // T
console.log(+0 === -0); // T
console.log(Object.is(+0, -0)); // F
console.log(NaN == NaN); // F
console.log(NaN === NaN); // F
console.log(Object.is(NaN, NaN)); // T
console.log(5 == 5); // T
console.log(5 == "5"); // T
console.log(5 === 5); // T
console.log(5 === "5"); // F
console.log(Object.is(5, 5)); // T
console.log(Object.is(5, "5")); // F
但是仍然没必要停止使用严格相等运算符,选 择 Object.is() ,
还是选择 == 或 === ,取决于代码的实际情况。
b. Object.assign() 方法
混入( Mixin )
在一次混入中,一个对象会从另一个对 象中接收属性与方法。
function mixin(receiver, supplier) {
Object.keys(supplier).forEach(function(key) {
receiver[key] = supplier[key];
});
return receiver;
}
任意曾使用 mixin() 函数的地方使用 Object.assign()
function EventTarget() { /*...*/ }
EventTarget.prototype = {
constructor: EventTarget,
emit: function() { /*...*/ },
on: function() { /*...*/ }
};
var myObject = {};
mixin(myObject, EventTarget.prototype);
myObject.emit("somethingChanged");
function EventTarget() { /*...*/ }
EventTarget.prototype = {
constructor: EventTarget, emit: function() { /*...*/ },
on: function() { /*...*/ }
}
var myObject = {}
Object.assign(myObject, EventTarget.prototype);
myObject.emit("somethingChanged");
第二个供应值,覆盖了前一个供应值
var receiver = {};
Object.assign(receiver,
{
type: "js",
name: "file.js"
},
{
type: "css"
}
);
console.log(receiver.type); // "css"
console.log(receiver.name); // "file.js"