JS 对象基本用法

71 阅读3分钟

JS 对象基本用法

JS 对象(object)

对象的定义

JavaScript的对象是一种无序的集合数据类型,它由若干键值对组成。在 JS 中对象用于描述现实世界中的某个对象,可以用若干键值对来描述它的属性。

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

如何声明对象

  let [对象名]={[属性名]:[属性值]}
  
  let obj = {'name':'frank','age':18}
  let obj = {2:'22222'}
  let obj=new Object({'name':'frank'})
  console.log({'name':'frank','age':18})  //匿名对象
  
  let a = 'xxx'
  let obj = {
     [a]:111
  }// 使用变量作为 key 的语法  
  /*不加[]的属性名会自动变成字符串
    加[]则会当作变量求值
    值如果不是字符串,则会自动变成字符串
  */
  

注意:

  • 键名是字符串,不是标识符,可以包含任意字符(空字符串也可以)

image.png

  • 引号可以省略,省略之后只能写标识符(需要按照标识符的规则写(可以写数字),但是同样视为字符串不按照这个规则写识别不出来)
  • 就算引号省略了,键名也还是字符串

image.png

属性名(property): 每个 key 都是对象的属性名 用 Object.keys(obj)可以得到 obj 的所有 key。

除了字符串,symbol 也能做属性名

   let a = Symbol()
   let obj = {[a]:'Hello'}

属性值(value): 每个 value 都是对象的属性值

对象的隐藏属性

JS 中每一个对象都有一个隐藏属性,这个隐藏属性储存着其共有属性组成的对象的地址 这个共有属性组成的对象叫做原型,即隐藏属性储存着原型的地址。

对象的原型也有原型,obj={}的原型即为所有对象的原型,这个原型包含所有对象的共有属性,叫做对象的根,这个原型也有原型,是 null。

  var obj ={}
  obj.toString()//obj 的隐藏属性对应的对象上有 toString()

如何删除对象的属性

delete obj.xxxdelete obj['xxx'] 即可删除 obj 的 xxx 属性。

注意:属性值为 undefined 和不含属性名的区别:
不含属性名:

'xxx' in obj === false

含有属性名但是值为 undefined:

'xxx' in obj && obj.xxx === undefined

删除属性和把属性值设置为 undefined 的区别:

image.png

如何查看对象的属性

查看自身所有属性:Object.keys(obj)

查看自身+共有属性:console.dir(obj)或者一次用 Object.keys 打印出 obj.__proto__

判断一个属性是自身的还是共有的:obj.hasOwnProperty('xxx')

'name' in obj 和 obj.hasOwnProperty('name') 的区别是? 'name' in obj 用于判断 name 是否是 obj 的属性,包括自身的属性和共有属性;而 obj.hasOwnProperty('name') 用于判断 name 是否是 obj 自身的属性。举例如下:

image.png

查看属性的两种语法:

中括号语法:obj['key']

点语法:obj.key

注意: obj.name 等价于 obj['name'] 而不等价于 obj[name]

这里的 name 是 字符串,而不是变量

let name='frank' obj[name] 等价于 obj['frank'] 而不等价于 obj['name']obj.name

如何修改/增加对象的属性

  1. 直接赋值
  let obj = {name:'frank'}// name 是字符串
  
  obj.name = 'frank' 
  
  obj['name'] = 'frank'
  
  obj['na'+'me'] = 'frank'
  
  let key ='name'
  obj[key] = 'frank'
  1. 批量赋值
  Object.assign(obj,{age:18,gender:'man'})
  1. 共有属性的修改

无法通过自身修改或增加共有属性:

image.png

修改原型上的属性可以用obj.__proto__.toString='xxx'(但不建议)或者Object.prototype.toString = 'xxx'

修改隐藏属性推荐使用 Object.create 示例如下:

image.png