使用对象字面量定义对象
例子：
var obj = {
name: "Tom",
age: 20,
getName: function() {
console.log(this.name)
}
}
重点解析
在使用对象字面量语法时，属性名也可以使用字符串。
例子：
var obj = {
"name": "Tom",
"age": 20,
1: "one",
"getNum": function() {
console.log(this["1"])
}
}
*数值属性名会自动转换为字符串。
当需要向函数传入大量可选参数时，对象字面量是首选方式。
例子：
var obj = {
"name": "Tom",
"age": 20,
"getNum": function(s1, s2) {
console.log("My name is " + s1 + " ,age is " + s2 + " .")
}
}
objInfo(obj)
function objInfo(obj) {
var str1, str2;
if (typeof(obj.name) == "string") {
str1 = obj.name;
}
if (typeof(obj.age) == "number") {
str2 = obj.age;
}
if (typeof(obj.getNum) == "function") {
obj.getNum(str1, str2)
}
}
//输出：My name is Tom ,age is 20 .
在JavaScript中可以使用点表示法或者方括号表示法来访问对象的属性，在使用方括号语法时，应该将要访问的属性以字符串的形式放在方括号中。从功能上看，这两种访问对象属性的方法没有任何区别。但是当属性名是变量或者属性名中包含会导致语法错误的字符，或者属性名使用的是关键字或保留字，必须使用方括号表示法。
例子：
var obj = {
"my-name": "Tom",
"my-age": 20,
1: true
}
var a = "my-name";
console.log(obj[a])
console.log(obj["my-age"])
console.log(obj["1"])
//输出：Tom，20，true
在最后一个属性后面添加逗号，会在IE7及更早版本和Opera中导致错误。
ES6中对象字面量的扩展
对象方法的简写
ES5中如果为对象添加方法，必须通过指定名称并完整定义函数来实现。
例子：
var obj = {
name: "Tom",
getName: function() {
return this.name;
}
}
console.log(obj.getName());
//输出：Tom
而在ES6中，消除了冒号和function关键字。
例子：
const obj = {
name: "Tom",
getName() {
return this.name;
}
}
console.log(obj.getName());
//输出：Tom
我们可以在对象字面量中为属性创建取值函数（getter）和存值函数（setter），前提必须是对象方法的简写形式。
例子：
let obj = {
_name: "Tom",
get name() {
return this._name;
},
set name(value) {
this._name = value;
}
}
console.log(obj.name); //输出：Tom
obj.name = "Amy";
console.log(obj.name); //输出：Amy
属性值的简写
如果在函数中使用对象字面量创建一个对象，对象的属性名与函数的命名参数同名时，可以只写属性名即可，省略参数变量名。
例子：
ES5 的写法
var obj = (function(name, age) {
return {
name: name,
age: age
}
})("Tom", 19);
console.log(obj.name);
//输出：Tom
ES6的写法
const obj = (function(name, age) {
return {
name,
age
}
})("Tom", 19);
console.log(obj.name);
//输出：Tom
在对象字面量中使用可计算属性名称
ES5中，如果属性名提前已知，我们在访问这个属性的时候，可以使用方括号通过计算访问到属性的值。
例子：
var getName = (function(name_1, name_2, name_3) {
var obj = {
name_1: name_1,
name_2: name_2,
name_3: name_3
}
return function(n) {
//通过计算取得属性值
console.log(obj["name_" + n]);
}
})("Tom", "Amy", "Lili");
getName(1); //输出：Tom
getName(2); //输出：Amy
getName(3); //输出：Lili
ES6中进一步扩展，我们也可以在定义对象字面量的时候，使用可计算的属性名称。其语法与访问可计算属性名称相同，也是使用方括号。
例子：
const getName = ((name) => {
const obj = {
//定义属性
[name + "_1"]: "Tom",
[name + "_2"]: "Amy",
[name + "_3"]: "Lili"
}
return n => {
console.log(obj["name_" + n]);
}
})("name");
getName(1); //输出：Tom
getName(2); //输出：Amy
getName(3); //输出：Lili
对象解构
ES5中，为了从对象中获取特定数据并赋值给变量，我们经常会进行如下的操作：
例子：
var obj = {
name: "Tom",
age: 19
}
var $name = obj.name,
$age = obj.age;
console.log($name);
//输出：Tom
ES6为对象添加了解构功能，以简化获取对象中数据的过程。对象解构采用对象字面量的语法形式，即在等号左边放置一个对象字面量，去匹配等号右边的对象字面量。变量的属性没有次序，因此只要属性名相同，就能取得右侧的值，并赋值给左侧的变量。
例子：
let {
age: $age,
name: $name
} = {
name: "Tom",
age: 19
};
console.log($name);
//输出：Tom
上例中要注意：等号左侧中，真正被赋值的是变量
$name和$age，而不是变量前面的属性名name和age。这里的name和age只是一种匹配模式，去匹配等号右侧的同名属性。
如果等号左侧中，变量名与属性名相同，也可以省略变量名。
例子：
let {
name,
age
} = {
name: "Tom",
age: 19
};
console.log(name);
//输出：Tom
上面的例子中，我们一直用let声明变量并马上进行解构赋值。如果我们先声明了变量，之后再解构赋值，这时候需要一对小括号包裹解构赋值的语句，将块语句转换成表达式。
例子：
let name = "Tom",
age = 22;
let obj = {
name: "Amy",
age: 19
};
({
name,
age
} = obj);
console.log(name);
//输出：Amy
使用对象解构进行赋值时，如果左侧的变量名对应的属性名称在右侧的对象中不存在，这个变量会被赋值为undefined。
例子：
let {
name,
age,
job
} = {
name: "Tom",
age: 19
};
console.log(job);
//输出：undefined
为了防止指定的属性不存在，我们可以为变量设置默认值。只有当该属性在右侧对象中不存在时或右侧属性值为undefined时，默认值才会生效。
例子1：
const {
name,
age,
job = "worker"
} = {
name: "Tom",
age: 19
};
console.log(job);
//输出：worker
例子2：
const {
name,
age,
job: $job = "worker"
} = {
name: "Tom",
age: 19,
job: undefined
};
console.log($job);
//输出：worker
嵌套解构赋值
例子：
let obj = {
name: "Tom",
age: 19,
job: {
worker: ["php", "java", "asp"]
}
};
let {
name,
age,
job: {
worker
}
} = obj;
console.log(worker[0]);
//输出：php
上例中，job是匹配模式，代表着在对象中检索的位置。如果job也要作为变量进行赋值，可以写成下面这样：
例子：
let obj = {
name: "Tom",
age: 19,
job: {
worker: ["php", "java", "asp"]
}
};
let {
name,
age,
job,
job: {
worker
}
} = obj;
console.log(worker[0]); //输出：php
console.log(job); //输出：worker:["php", "java", "asp"]
文中的代码部分，带有“例子”和“测试代码”字样的，只是用来学习或测试某一功能用的代码，不可以直接用于项目的开发中。带有“代码如下”字样的，都是经过本人测试，简单修改即可用于项目开发中的代码，如有错误，欢迎指出。
随时随地看视频
