JS对象基本用法

141 阅读3分钟

一、对象object

  • 是七种数据类型中,唯一一个复杂类型
  • 对象中可包含其他六个数据类型或对象

1、定义

  • 无序的数据集合
  • 键值对的集合

2、写法

2.1、let obj={'name':'lan','age':26}
  • 键名一定是字符串,可包含任意字符,如空字符串、空格字符串、表情字符串等
  • 引号大部分时候可省,但省略后只能写标识符或数字,就算引号省略了,键名也一定是字符串
  • 没有数字键名、没有数字下标
2.2、let obj=new Object({'name':'lan','age':26})
  • 这是标准写法
2.3、console.log({'name':'lan','age':26})
  • 这个对象没有名字
  • 一定要写console.log,不然就不是对象

3、属性名属性值

  • 每个key都是对象的属性名
  • 每个value都是对象的属性值
3.1、所有属性名会自动变成字符串(symbol也能作属性名)
  • 1e2:100——>'100':100,1e2会先变成数字
  • 1e-2:100——>'0.01':100
  • 0xFF:100——>'255':100,0xFF会先变为十进制数字
  • .234:100——>'0.234':100
  • 所以加引号是最安全的写法
  • Object.keys(obj),可打出所有的键名
3.2、变量作属性名
let a='ccc'
let obj={[a]:111}
  • 此时属性名为'ccc'
  • 不加[]的属性名会自动变成字符串
  • 加了[]的则会当作变量求值
  • 如果不是字符串会自动变成字符串
3.3、对象的隐藏属性
  • 每个对象都有隐藏属性
  • 储存着其共有属性组成的对象的地址
  • 这个共有属性组成的对象叫做原型
  • 综上,隐藏属性储存着原型的地址
  • 共有属性省内存 微信图片_20230307111441.jpg

二、增删改查对象的属性

1、删

1.1、删除属性
  • delete obj['xxx']/delete obj.xxx,删除属性
  • obj.xxx=undefined,只是删除属性值,该属性仍在
1.2、查看一个属性是否在一个对象里
  • 'xxx' in obj===false/ture
  • 若obj.xxx=undefined,则'xxx' in obj&&obj.xxx===undefined,含有该属性值但值为undefined
  • 注意:obj.xxx===undefined,不能断定xxx为obj的属性 微信图片_20230307110801.png

2、查

2.1、查看自身所有属性(读属性)
  • Object.keys(obj),查看属性名
  • Object.values(obj),查看属性值
  • Object.entries(obj),查看属性名和值
2.2、查看自身+共有属性
  • console.dir(obj),打印查看所有属性
2.3、判断一个属性是自身的还是共有的
  • obj.hasOwnProperty('name')
2.4、查单个属性
  • obj['name'],优先使用
  • obj.name
  • 有坑写法,obj[name],这里的name是变量,要先求出这个name,如:let name='name1',那么obj[name]等价于obj['name1']
  • obj[console.log('name')],返回值为name和undefined,这里的name和name对应,log的返回值为undefined
2.5、'name' in obj和Object.hasOwnProperty('name')的区别
  • 'name' in obj是查看这个属性是否在obj里,共有属性也为ture
  • Object.hasOwnProperty('name')是查看这个属性是否是obj自己的属性,共有属性为false

微信图片_20230307124941.png

3、原型

3.1、每个对象都有原型
  • 原型里存着对象的共有属性
  • obj的原型就是一个对象
  • obj.__proto__存着这个对象的地址
  • 这个对象里有toString/constructor/valueOf等属性
3.2、对象的原型也是对象
  • 对象的原型也有原型
  • obj={}的原型即为所有对象的原型
  • 这个原型包含所有对象的共有属性,是对象的根
  • 这个原型也有原型,是null
3.3、原型链
  • 从对象到原型之间可以加任意对象 微信图片_20230307121217.png 微信图片_20230307121444.jpg
  • 强烈不推荐使用__proto__,可以用Object.create 微信图片_20230307121839.png
  • 注意:要改原型一开始就改,别后来再改

4、增、改

4.1、赋值
  • 直接赋值,obj['name']='lan'
  • 批量赋值,Object.assign(obj,{'age':26,'gender':'woman'})
4.2、无法通过自身修改或增加共有属性
  • obj.toString='xxx',只会改在自己的属性上,原型上的toString还是那个函数 微信图片_20230307122952.png
4.3、偏要改共有属性
  • obj.proto.toString='xxx'
  • 强烈不推荐使用__proto__,可以Object.prototype.toString='yyy'
  • 最好别动共有属性
  • 如果非要改,那就使用window.Object.prototype.toString='zzz'
  • obj.proto=null,可以将共有属性删掉 微信图片_20230307123842.png
  • 以上,慎用,别用。