📅 最后修改于: 2021-01-01 04:03:50 🧑 作者: Mango
对象是键/值对的集合，可以像哈希图或字典一样在对象的整个生命周期中对其进行修改。对象使我们可以在JavaScript中定义自定义数据类型。
与原始数据类型不同，我们可以使用对象表示复杂或多个值。这些值可以是对象数组或标量值，也可以是函数。对象内部的数据是无序的，值可以是任何类型。
可以使用大括号{…}和可选的属性列表来创建对象。该属性是“键：值”对，其中键是字符串或属性名称，值可以是任何值。
创建空对象有两种语法：
var user = {}; // 'object literal' syntax
var name = new Object(); //'object constructor' syntax
与原始数据类型相似，对象也具有字面量语法。对象字面量是在JavaScript中创建对象的广泛使用的模式之一。
ES6通过以不同的方式扩展语法，使对象字面量更加简洁和健壮。
让我们看看对象属性初始化器的简写。
在ES6之前，对象字面量是名称-值对的集合。例如，
在ES5中
function user(name, division) {
return {
name: name,
divison: division
};
}
上述函数的用户()采用两个参数，这是名称和分裂，并返回一个新的对象字面量具有两个属性名称和分裂。属性名称和除法采用函数参数的值。
上面的语法看起来是重复的，因为名称和除法在属性的键和值中两次提到。
当对象属性与局部变量的名称相同时， ES6中的语法消除了重复。让我们通过函数来了解这一点。
在ES6中
function user(name, division) {
return {
name,
divison
};
}
在上面的代码片段中，JavaScript引擎将name和division参数的值分配给name和division属性。
同样，我们可以通过局部变量构造对象字面量，如以下示例所示：
例
let uname = 'Anil',
udivision = 'First';
let user = {
uname,
udivision
};
console.log(user.uname);
console.log(user.udivision);
输出量
Anil
First
通过使用这种简写语法，JavaScript引擎在作用域中查找具有相同名称的变量。如果找到，则将变量的值分配给属性。但是，如果找不到它，则将发生参考错误。
在ES6之前，我们可以使用方括号[]启用对象属性的计算属性名称。方括号表示法允许我们使用变量和字符串字面量作为属性的名称。
ES6引入了一项新功能“计算属性名称” ，它是对象字面量语法的一部分，并且使用方括号[]表示法。它允许我们在方括号[]中放置一个表达式，该表达式将被计算并用作属性的名称。
让我们通过使用以下示例来了解计算的属性名称：
在ES5中
var emp = {
id : 101,
name : 'Amit'
}
var department = 'dep_name';
emp[department]='Sales';
console.log(emp);
输出量
{ id: 101, name: 'Amit', dep_name: 'Sales' }
在ES6中
var department = 'dep_name';
var emp = {
id : 102,
name : 'Anil',
[department]:'Production'
}
console.log(emp);
输出量
{ id: 102, name: 'Anil', dep_name: 'Production' }
在ES6之前，为对象字面量定义方法，我们必须指定完整函数的名称和定义，如以下示例所示：
例
let user = {
firstName : "Sunil",
lastName : "Kumar",
fullName : function(){
return this.firstname + " " + this.lastName;
}
};
ES6使用速记语法，也称为简明方法语法，通过删除冒号(:)和函数关键字来使对象字面量的方法简明扼要。
让我们通过重写对象user在上面的示例中使用此语法。
let user = {
firstName : "Sunil",
lastName : "Kumar",
fullName(){
return this.firstname + " " + this.lastName;
}
};
可以通过以下两种方法在ES6中合并两个JavaScript对象：
让我们尝试了解这两种方法。
此方法用于将值和属性从一个或多个源对象复制到目标对象。它返回目标对象，包括从目标对象复制的属性和值。
句法
Object.assign(target, sources)
例
var obj1 = {1 : "Hello", 2: "World"};
var obj2 = { 3 : "Welcome", 4: "to"};
var obj3 = { 5 : "javaTpoint"}
// Using Object.assign()
var final_obj = Object.assign(obj1, obj2, obj3);
console.log(final_obj);
输出量
{
'1': 'Hello',
'2': 'World',
'3': 'Welcome',
'4': 'to',
'5': 'javaTpoint'
}
克隆是将对象从一个变量复制到另一个变量的过程。我们可以使用object.assign()方法克隆一个对象。
让我们尝试通过以下示例来理解它：
例
let obj1 = {
name: 'Anil',
age: 22
};
let cloneobj = Object.assign({}, obj1);
cloneobj.age = 32;
console.log(obj1);
console.log(cloneobj);
输出量
{ name: 'Anil', age: 22 }
{ name: 'Anil', age: 32 }
它广泛用于需要多个值的变量数组中。由于JavaScript中的对象是键/值配对的实体，因此我们可以使用spread运算符将它们合并为一个。
句法
var new_obj = [...obj1, ...obj2, ...]
例
var obj1 = {1 : "Hello", 2: "World"};
var obj2 = { 3 : "Welcome", 4: "to"};
var obj3 = { 5 : "javaTpoint"}
var final_obj = {...obj1, ...obj2, ...obj3};
console.log(final_obj);
输出量
{
'1': 'Hello',
'2': 'World',
'3': 'Welcome',
'4': 'to',
'5': 'javaTpoint'
}
使用delete运算符可以删除或删除属性。让我们了解如何通过使用以下示例删除属性。
例
var obj = new Object;
obj.a = 50;
obj.b = 200;
delete obj.a;
console.log (obj.a);
输出量
undefined
它类似于数组解构，除了可以从对象中提取属性(或键)及其对应的值，而不是从数组中提取值。
销毁对象时，我们使用键作为变量的名称。变量名称必须与对象的属性(或键)名称匹配。如果不匹配，则它将收到未定义的值。这就是JavaScript知道我们要分配对象的哪个属性的方式。
要了解有关对象分解的更多信息，可以单击此链接ES6 Object destructuring 。