JavaScript对象类型

260 阅读6分钟

一、定义

对象object是无序的数据集合,是键值对的集合,是一种数据类型可以在谷歌控制台返回的,对象就是由一些属性和方法组合在一起的数据实体,对象使用一个名字来表示一组值,每个值就是对象的一个属性

二、写法

  1. 正规写法:let 对象名 = new 0bject({'name': 'frank'})

  2. 简便写法: let 对象名 = { 'name': 'frank', 'age':18 }

  3. 匿名写法:console.log({ 'name': 'frank', 'age':18 })

细节

  • 键名是字符串!
  • 加了引号的键名可以包含任意字符,比如空格、以数字开头
  • 没加引号的键名按照标识符规则写。但可以以数字开头。
  • 就算引号省略了,键名也还是字符串

三、对象的属性

1、属性名:每个key都是对象的属性名(property)

  • 所有属性名都会自动变成字符串
  • 加了引号的已经是字符串了,就不会改变了
  • 没加引号的会把你变成字符串
  • 比如一个十六进制数0xFF做键名,还没加引号,就会自动变成255,并且加上引号
  • Object.keys(obj)可以打印出obj这个对象的键名也就是属性名
  • 如果想用一个变量的值做属性名
let a = 'xxx'
var obj = {a:'1111'}

上面代码中对象obj里的属性名是一个字符串a,就算不写引号还是字符串a啊,和前面声明的变量a无任何关系。

但是如果想用a变量的值做属性名,那键名应写成[a]即可. 而且a变量的值不是字符串,也会自动变成字符串

var obj = {[a]:'1111'}

这其实是下列代码的合写形式

let a = 'xxx'
var obj = {}
obj[a] : '1111'  a是下标
  • 超纲知识:除了字符串, symbol也能做属性名,在学习「迭代」时会用到。其实压根不用
let a = Symbol()
let obj = { [a]: 'Hello' }
  • 不加[]的属性名会自动变成字符串
  • 加了[]则会当做变量求值

2、属性值

  • 每个value都是对象的属性值
  • 属性值可以是对象

3、对象的隐藏属性

  • JS中每个对象都有一个隐藏属性_ _proto_ _
  • 这个隐藏属性的值储存着所有对象共有属性组成的对象的地址
  • 这个由所有对象共有属性组成的对象window.Object.prototype叫做原型,也称为对象的根
  • 也就是说,每个object对象的隐藏属性_ _proto_ _储存着原型window.Object.prototype的地址
  • 每个对象都有原型
  • 原型也是个对象,所以也有原型,这不过原型的原型为null(空,但是是存在的)
  • 目的在于省内存

代码示例

var obj= {}
obj.toString() //居然不报错

因为obj的隐藏属性对应的对象上有toString()

三、对象属性的增删改查

(一)删除属性

  1. delete obj.xxxdelete obj['xxx']:即可删除obj的XXX属性,此时属性值当然也没有了

  2. 注意比较区别:obj.xxx = undifined xxx属性名还在,只是属性值变为undifined空

  3. 举例

  • 例1

注:只能用'xxx' in obj 查看属性名是否还在对象中:true表示在,false表示不在

  • 例2

注:

①语句'xxx' in obj && obj.xxx === undefined返回true,表示属性xxx还在obj中,而且属性xxx的值是undefined

②注意obj.xxx === undefined不能断定'xxx' 是否为obj的属性。证明如下

③只能用'xxx' in obj 查看属性名是否还在对象中:true表示在,false表示不在

(二)读属性

1、查看一个对象的所有属性

  1. 查看一个对象的所有自身属性: Object.keys(obj)

  2. 查看一个对象的所有自身属性值: Object.values(obj)

  3. 查看一个对象的所有自身的属性和值:直接对象名就行obj或者Object.entries(obj)

  4. 查看自身+共有属性: console.dir(obj)

  5. 查看共有属性: 自己依次用Object.keys打印出obj.__ proto_

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

返回true说明该属性是自身属性,返回false说明该属性是共有属性

  1. 'key' in obj查看属性名是否还在对象中:true表示在,false表示不在

2、查看一个对象的一个属性

①中括号语法: obj['key']obj['k'+'ey']

②点语法: obj.key(与①等价)

③注:obj[key]只能在提前声明key是个变量,我们是想把这个变量的值作为属性名的时候用!!!

④举例

var a = 'xxx'
var obj = { [a] : '1111','name' : 'wawa'}
obj['name']===obj.name
obj[a]===obj['xxx']

⑤练习

let list = ['name','age','gender']
let person = {
    name: 'yy', age : 18, gender : 'woman'
}
for (let i = 0; i < list.length; i++) {
    let name = list [i]
    console.log(person.name)  //重点
}
/// 结果为person的第一个属性值yy*3
let list = ['name','age','gender']
let person = {
    name: 'yy', age : 18, gender : 'woman'
}
for (let i = 0; i < list.length; i++) {
    let name = list [i]
    console.log(person[name]) //重点
}
// 结果为person的所有属性值yy、18、woman

(三)修改或增加属性

1、自身属性

(1)直接赋值

let obj = {name:'frank'}

obj.key = 'xxx'

obj['key'] ='xxx'

obj['k'+'ey'] ='xxx'

let key = 'name'; obj[key] = 'yy'

(2)批量赋值

Object.assign(obj, {age: 18, gender: 'man'})

2、修改或增加共有属性

(1)一个对象

  • 在一个对象中,它的原型中的共有属性只可用来读,无法修改
  • 要是在一个对象中修改了共有属性,那么其实这个被修改了的共有属性直接放在obj自身里面,不会存入原型,因为本质上只是存了一个地址而已

  • 例子(不推荐):一个一个共有属性的改 obj.__proto__.tostring尽量不要这样修改因为__proto__不是标准是浏览器决定的,应该用window.Object.prototype修改和obj.__proto__存放同一个地址
  • 例子(不推荐):直接把这个对象里存了原型地址的隐藏属性重新赋值为新原型的地址。
let obj = {name:'frank'}
let newproto = {'国籍''中国'} //创建一个新对象,它将成为obj的新原型,当然因为是个对象,它里面还有个隐藏属性__proto__
obj.__proto__ = newproto //把新原型赋值

  • 原型链:直接以新原型为原型创建一个对象。推荐,一开始就改好!
  • 共有的共有还可以访问到,就相当于把旧共有加了几个属性
let obj2 = Object.create(newproto) //以newproto为共有属性创建属性

心得

  • 凡是数据类型都可以为
  • 如果一个对象里没该属性那么object.属性名 === undefined
    但是属性值可以为undefined所以不能用object.属性名 === undefined来判断是否有该属性
  • 因此判断对象里是否有某个属性只能用key in,不能用点和[]