在JavaScript中,对象是个无序的键值对数据集。例如:

  var xiaoqiang={
name:"wangqiang",
age:30,
city:"guangzhou",
job:"engineer"
}

上述例子中的小强是一位年轻人,对于这个对象我们用一个括号进行定义。在括号体内我们描述了这个人的几种属性:姓名、年龄、所在城市,工作等。 每一个属性对应一个值,形成了一个数据集。

对象属性的访问、添加、删除

我们可以通过点操作符访问一个对象的属性,访问小强的姓名可以用xiaoqiang.name,也可以用方括号的方式xiaoqiang["name"]的方式。还可以动态添加一个属性, 动态删除一个属性。例如:

  xiaoqiang["name"];    //返回wangqiang
xiaoqiang.name; //返回wangqiang
xiaoqiang.height; //undefined
xiaoqiang.height = 1.8 // 给xiaoqiang动态添加了一个属性
delete xiaoqiang.height;

我们还可以通过Object的静态方法defineProperty动态地给一个对象添加属性。下面的例子,我们动态地给xiaoli对象添加一个name属性:

  xiaoli = {};
Object.defineProperty(xiaoli,"name",{
value:"xiaoli",
writable:false, // 属性不能修改,
enumerable:true, // 属性可枚举,如:可以通过for ( let item of Object.entries(xiaoli)){...} 的方式枚举属性
})

对象属性的测试

通过in关键字测试对象中的属性,也可以通过Object的hasOwn方法测试对象属性。一个对象的属性包括自有属性和继承来的属性。

  "name" in xiaoqiang;    //true;
"toString" in xiaoqiang; //true 通过object对象继承的属性
xiaoqiang.hasOwnProperty("age") //true age是xiaoqiang自己的属性
xiaoqiang.hasOwnProperty("toString")//false 通过继承自object的属性,不算自己的属性
Object.hasOwn(xiaoqiang,"age"); //true Object的静态方法判断是否是自己的属性
Object.hasOwn(xiaoqiang,"toString"); //false
Object.getOwnPropertyNames(person); //获取所有自身的属性名称

特殊情况

在定义一个对象时,对象属性的键是字符串类型,一般情况下可以省略单引号或双引号。如果键中包含特殊的字符,那就必须带上双引号或单引号,例如:

  var xiaoqiang={
name:"wangqiang",
age:30,
city:"guangzhou",
job:"engineer",
"company-address":"tianhe district,guangzhou" // company-address要加引号
}
xiaoqiang["company-address"]

上述对象xiaoqiang的company-address属性带有特殊的符号,所以定义的时候需用引号包裹起来,在进行属性访问的时候需用方括号

对象属性以及值的遍历

使用Object的entries方法,然后进行遍历

  var xiaoqiang={
name:"wangqiang",
age:30,
city:"guangzhou",
job:"engineer",
"company-address":"tianhe district,guangzhou" // company-address要加引号
}
//对象属性的遍历。
for (let item of Object.entries(xiaoqiang)){
console.log(item[0],item[1]);
}

使用Object的keys方法和values方法,然后进行遍历

  var xiaoqiang={
name:"wangqiang",
age:30,
city:"guangzhou",
job:"engineer",
"company-address":"tianhe district,guangzhou" // company-address要加引号
}
//对象键的遍历。
for (let item of Object.keys(xiaoqiang)){
console.log(item);
}
//对象值的遍历。
for (let item of Object.values(xiaoqiang)){
console.log(item);
}

对象的冻结、密封、不可扩展

冻结对象:一个冻结对象是指已经不能添加新属性、删除现有属性或修改已有属性的值的对象。使用 Object.freeze() 方法可以将对象转换为冻结对象。

  var lihong={};
lihong.name="lihong";
lihong.age=20;
Object.freeze(lihong);
lihong.height = 171; //height属性添加不成功
delete lihong.age; //age属性删除不成功
lihong.name = "Lihong"; //age属性修改不成功

密封对象:一个密封对象是指已经不能添加新属性和删除现有属性的对象,但是可以修改已有属性的值。使用 Object.seal() 方法可以将对象转换为密封对象。

  var lihong={};
lihong.name="lihong";
lihong.age=20;
Object.seal(lihong);
lihong.height = 171; //height属性添加不成功
delete lihong.age; //age属性删除不成功
lihong.name = "Lihong"; //name属性可修改的

不可扩展对象:一个不可扩展对象是指已经不能添加新属性的对象,但是可以修改现有属性的值或删除现有属性。使用 Object.preventExtensions() 方法可以将对象转换为不可扩展对象。

  var lihong={};
lihong.name="lihong";
lihong.age=20;
Object.preventExtensions(lihong);
lihong.height = 171; //height属性添加不成功
delete lihong.age; //age属性是可删除的
lihong.name = "Lihong"; //name属性是可修改的

文章同时发表在:码农编程网 欢迎访问

本节重点

  • 对象是一个无序键值对的数据集;
  • 对象的属性必须是字符串、如包含特殊的字符引号包裹起来;
  • 对象属性的添加、测试、对象属性和值的遍历;
  • 冻结对象、密封对象、不可扩展对象。

深入了解Js中的对象的更多相关文章

  1. js中判断对象具体类型

    大家可能知道js中判断对象类型可以用typeof来判断.看下面的情况 <script> alert(typeof 1);//number alert(typeof "2" ...

  2. 浅解析js中的对象

    浅解析js中的对象 原文网址:http://www.cnblogs.com/foodoir/p/5971686.html,转载请注明出处. 前面的话: 说到对象,我首先想到的是每到过年过节见长辈的时候 ...

  3. js中XMLHttpRequest对象实现GET、POST异步传输

    js中XMLHttpRequest对象实现GET.POST异步传输 /* * 统一XHR接口 */ function createXHR() { // IE7+,Firefox, Opera, Chr ...

  4. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  5. js中推断对象详细类型

    大家可能知道js中推断对象类型能够用typeof来推断. 看以下的情况 <script> alert(typeof 1);//number alert(typeof "2&quo ...

  6. JavaScript学习12 JS中定义对象的几种方式【转】

    avaScript学习12 JS中定义对象的几种方式 转自:  http://www.cnblogs.com/mengdd/p/3697255.html JavaScript中没有类的概念,只有对象. ...

  7. JS中有关对象的继承以及实例化、浅拷贝深拷贝的奥秘

    一.属性的归属问题 JS对象中定义的属性和方法如果不是挂在原型链上的方法和属性(直接通过如类似x的方式进行定义)都只是在该对象上,对原型链上的没有影响.对于所有实例共用的方法可直接定义在原型链上这样实 ...

  8. JS中定义对象和集合

    在js中定义对象: 方式一: var obj = {}; obj['a']=1; obj['b']=2; 方式二: var obj=new Object(); obj.a=1; obj.b=2; 在j ...

  9. Js中Map对象的使用

    Js中Map对象的使用 1.定义 键/值对的集合. 2.语法 mapObj = new Map() 3.备注 集合中的键和值可以是任何类型.如果使用现有密钥向集合添加值,则新值会替换旧值. 4.属性 ...

  10. JS中的对象和方法简单剖析

    众所周知,在js中对象就是精髓,不理解对象就是不理解js. 那么什么事js中的对象呢? 在js中,几乎一切皆对象: Boolean ,String,Number可以是对象(或者说原生数据被认作对象): ...

随机推荐

  1. Dubbo和Zookeeper(Springboot集成)

    Dubbo和Zookeeper集成: 分布式理论: 分布式系统是由一组通过网络进行通信.为了完成共同的任务而协调工作的计算机节点组成的系统.分布式系统的出现是为了用廉价的.普通的机器完成单个计算机无法 ...

  2. Spring Cloud Alibaba实现服务的无损下线功能

    目录 1.背景 2.解决方案 2.1 找到通过负载均衡组件获取可用服务信息的地方 2.2 解决思路 3.部分实现代码 3.1 引入jar 3.2 编写服务下线方法 3.3 监听配置变更,清除服务缓存 ...

  3. 剑指 offer 第 21 天

    第 21 天 位运算(简单) 剑指 Offer 15. 二进制中1的个数 编写一个函数,输入是一个无符号整数(以二进制串的形式),返回其二进制表达式中数字位数为 '1' 的个数(也被称为 汉明重量). ...

  4. PyQt5学习 (3)--QWidget(下)

    层级关系.层级控制: 调整Z轴顺序 点击查看代码 label1 = QLabel(window) label1.setText("标签1") label1.resize(200, ...

  5. OpenTranslator:一款基于ChatGPT API的翻译神器

    这是一款使用 ChatGPT API 进行划词翻译和文本润色的浏览器插件.借助了 ChatGPT 强大的翻译能力,它将帮助您更流畅地阅读外语和编辑外语. 它能干啥 一. 可翻译 二. 可润色 三. 可 ...

  6. LAL v0.34.3发布,G711音频来了,Web UI也来了

    Go语言流媒体开源项目 LAL 今天发布了v0.34.3版本. LAL 项目地址:https://github.com/q191201771/lal 老规矩,简单介绍一下: ▦ 一. 音频G711 新 ...

  7. Kubernetes 各个组件 启动参数介绍

    kube-controller-manager Kubernetes 控制器管理器是一个守护进程,内嵌随 Kubernetes 一起发布的核心控制回路.在机器人和自动化的应用中,控制回路是一个永不休止 ...

  8. python入门教程之一 什么是python

    python简介 1 什么是python Python是一种计算机程序设计语言.你可能已经听说过很多种流行的编程语言,比如非常难学的C语言,非常流行的Java语言,适合初学者的Basic语言,适合网页 ...

  9. [数据分析与可视化] Python绘制数据地图2-GeoPandas地图可视化

    本文主要介绍GeoPandas结合matplotlib实现地图的基础可视化.GeoPandas是一个Python开源项目,旨在提供丰富而简单的地理空间数据处理接口.GeoPandas扩展了Pandas ...

  10. C# System.ObjectDisposedException: Cannot access a disposed object, A common cause of thiserror is disposing a context that was resolved from dependency injection and then later trying touse...

    项目中使用了依赖注入,这个错误在我项目中的原因:在async修饰的异步方法中,调用执行数据库操作的方法时,没有使用await关键字调用,因为没有等待该调用,所以在调用完成之前将继续执行该方法.因此,已 ...