前端JS入门教程——JavaScript 对象直接量

爱前端-企业级实战型全栈大前端人才培养，只专注前端培训，前端教育我们更专业！

JavaScript中，创建对象可以使用构造函数方式。

代码实例如下:

obj.webName = "爱前端";
obj.address = "全栈大前端";

以上代码采用构造函数方式创建对象obj，为其添加两个属性并赋值。

var obj = {
  webName: "爱前端",
  address: "全栈大前端"
}

也可以使用更为简单的方式创建对象，那就是对象直接量，代码实例如下:

var obj = {
  "webName": "爱前端",
  address: "全栈大前端"
}

对象直接量是由键值对列表组成，列表包含在大括号中，属性名称和属性值由冒号分隔，每一个键值对之间是用逗号分隔，属性值可以是任何类型。属性名称可以用引号包括也可以不用，代码如下:

如果属性名称比较特殊，则需要加引号，比如属性名称中带有中划线，代码如下:

var obj = {
  webName: "爱前端",
  address: "全栈大前端",
  ant-zone:"前端教程"
}

代码会报错，使用引号包裹"ant-zone"可以消除错误。

属性值的设置与访问:

可以通过点运算符（.）对属性值进行访问和设置，代码实例如下:

var obj = {
  webName: "爱前端",
  address: "全栈大前端"
}
obj.age = 4;
console.log(obj.webName);
console.log(obj.address);
console.log(obj.age);

可以通过类数组方式，代码实例如下:

var obj = {
  webName: "爱前端",
  address: "全栈大前端"
}
console.log(obj["webName"]);

如果属性名称是数字，那么必须使用此种方式访问，否则会报错。

专注全栈大前端，爱前端整理了一批2019年最新WEB前端教学视频，不论是零基础想要学习前端还是学完在工作想要提升自己，这些资料都会给你带来帮助，从HTML到各种框架，帮助所有想要学好前端的同学，学习规划、学习路线、学习资料、问题解答。只要加入全栈大前端学习交流Q群：137503198 即可免费获取。
点击链接加入群聊【web前端技术学习交流群】

如果您对这个文章有任何异议，那么请在文章评论处写上你的评论。

如果您觉得这个文章有意思，那么请分享并转发，或者也可以关注一下表示您对我们文章的认可与鼓励。

愿大家都能在前端这条路，越走越远。