对象

2020-09-07 本文已影响0人懂会悟

1、delete()

delete方法的作用

删除对象属性
删除数组某一元素

删除成功返回true，删除失败返回false，直接使用delete删除变量返回false.
delete 删除数组元素后，被删除元素替换为undefined，数组长度不变

// 不能删除变量
var a = 1
console.log(delete a)
// false
let b = 2
console.log(delete b)
// false
const c = 3
console.log(delete c)
// false

// 删除数组元素
let array = [1,2,3,4,5,6]
console.log(array.length)
// 6
delete array[2]
console.log(array.length)
// 6
console.log(array)
// [ 1, 2, <1 empty item>, 4, 5, 6 ]
console.log(array[2])
// undefined

// 删除对象属性
const info = { name: 'Tom', age: 18 }
const res = delete info.name
console.log(res)
console.log(info)

2、增加/修改属性

给对象增加一个属性或者修改属性，直接给对象属性名赋值即可，值得注意的是：当使用变量作为key是需要加上[]

// 变量作为key
let key = 'name'
const info = {}
info[key] = 'Tom'
console.log(info)
// { name: 'Tom' }

// 批量增加属性
const obj1 = { name: 'Tom' }
const obj2 = { age: 18 }
const result = Object.assign(obj1, obj2)
console.log(result)

3、删除属性

如上所述删除对象上的某一属性可以使用deletejike

4、查看属性

查看属性有两种方法obj. 或者obj[]

判断对象是否包含某一属性

in 查看对象本身以及对象原型上是否有此属性，返回true/false
hasOwnProperty：只能查看自身可枚举属性

// in
// getPrototypeOf:获取原型
const info = { name: 'Tom', age: 18 }
const res = 'toString' in info
const resProp = 'toString' in Object.getPrototypeOf(info)
console.log(res)
// true
console.log(resProp)
// true

// hasOwnProperty
const info = { name: 'Tom', age: 18 }
const res = info.hasOwnProperty('toString')
const resProp = Object.getPrototypeOf(info).hasOwnProperty('toString')
console.log(res)
// false
console.log(resProp)
// true

5、判断对象是否为空

转为字符串
for in循环
getOwnPropertyNames
Object.keys()

// 转为字符串
const info = { name: 'Tom', age: 18 }
const string = JSON.stringify(info)
if (string === '{}') {
  return false
}

// for in循环
const info = { name: 'Tom', age: 18 }
function isEmpty() {
  for (const key in info) {
    return false
  }
  return true
}
console.log(isEmpty())

// getOwnPropertyNames
const info = { name: 'Tom', age: 18 }
const arr = Object.getOwnPropertyNames(info)
console.log(arr.length)

// Object.keys()
const info = { name: 'Tom', age: 18 }
const arr = Object.keys(info)
console.log(arr.length)

6、对象常用方法

1、Object.assign()

Object.assign()：用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。返回目标对象。

let target = { name: 'Tom', age: 20 }
let source = { work: 'engineer' }
let result = Object.assign(target, source)

console.log(target)
// { name: 'Tom', age: 20, work: 'engineer' }
console.log(source)
// { work: 'engineer' }
console.log(result)
// { name: 'Tom', age: 20, work: 'engineer' }

2、Object.is()

Object.is()：用于判断两个值是否相等，包含number、string、Object.返回布尔值

let target = { name: 'Tom', age: 20 }
let source = { work: 'engineer' }
let result = Object.assign(target, source)
console.log(Object.is(target, result))
// true

3、Object.keys()、Object.values()、Object.entries()

Object.keys()：返回一个给定对象的自身可枚举属性key组成的数组
Object.values()：返回一个给定对象自身所有可枚举属性value的数组
Object.entries()：返回一个给定对象自身可枚举属性的键值对数组

let info = { name: 'Tom', age: 18 }
console.log(Object.keys(info))
// [ 'name', 'age' ]
console.log(Object.values(info))
// [ 'Tom', 18 ]
console.log(Object.entries(info))
// [ [ 'name', 'Tom' ], [ 'age', 18 ] ]

4、Object.defineProperty()

给对象上定义一个新属性，或者修改一个对象的现有属性，并返回这个对象

let obj = {}
let value = 'old'

const res = Object.defineProperty(obj, "attr", {
  get : () => {
    return value
  },
  set : (newValue) => {
    value = newValue
  },
  enumerable : true,
  configurable : true
})

console.log(obj.attr)
obj.attr = 'set new value'

5、Object.defineProperties()

给对象上定义多个新属性，或者修改对象的现有属性，并返回这个对象

let obj = {}
Object.defineProperties(obj, {
  'property1': {
    value: true,
    writable: true
  },
  'property2': {
    value: 'Hello',
    writable: false
  }
})
console.log(obj.property1)
console.log(obj.property2)

7、属性描述符

属性描述符：描述属性特征的特性。属性描述符的值true/false，根据特性的不同，可以把属性分成两种类型：数据属性和访问器属性。

常见的属性描述符

Configurable：表示能否通过delete删除属性从而重新定义属性
Writable：表示属性的值能否修改
Enumerable：表示属性能否被枚举即通过for-in循环是否能返回属性
Value：包含这个属性的数据值。读取属性值的时候，从这个位置读；写入属性值的时候，把新值保存在这个位置。这个特性的默认值为undefined
set：在写入属性时调用的函数。默认值为undefined。
get：在读取属性时调用的函数。默认值为undefined。

要想修改对象的属性必须通过defineProperty、defineProperties

// defineProperty
let person = {}
Object.defineProperty(person, "birth", {
  configurable: false,
  enumerable: false,
  writable: false,
  value: 2000
})
console.log(person.birth)
// 2000
person.birth = 1999
console.log(person.birth)
// 2000

8、和对象属性相关的方法

属性描述符：描述属性特征的特性

getOwnPropertyDescriptor: 返回属性描述
getOwnPropertyNames：返回属性名构成的数组
getPrototypeOf：返回对象原型

// getOwnPropertyDescriptor
let info = {
  a: 2
}
const res = Object.getOwnPropertyDescriptor( info, "a" )
console.log(res)
// { value: 2, writable: true, enumerable: true, configurable: true }

// getOwnPropertyNames
let info = {
  a: 2
}
const res = Object.getOwnPropertyNames(info)
console.log(res)

// [ 'a' ]
// getPrototypeOf
let info = {
  a: 2
}
const res = Object.getPrototypeOf(info)
console.log(res)

对象