这篇文章非常的重要和干货,基础对于很多人来说都是不重视的点,可往往更应该重视,在大厂中基础比一切都重要,好好看完这篇文章,你一定会收获满满!
1.Object.keys() - 获取对象的所有键:
javascript
复制代码
const user = {
name: 'John',
age: 30,
city: 'New York'
}
// 获取所有键名
const keys = Object.keys(user)
console.log(keys) // ['name', 'age', 'city']
// 实际应用:遍历对象
Object.keys(user).forEach(key => {
console.log(`${key}: ${user[key]}`)
})
2.Object.values() - 获取对象的所有值:
javascript
复制代码
const user = {
name: 'John',
age: 30,
city: 'New York'
}
// 获取所有值
const values = Object.values(user)
console.log(values) // ['John', 30, 'New York']
// 实际应用:计算总和
const prices = {
apple: 1,
banana: 2,
orange: 3
}
const total = Object.values(prices).reduce((sum, price) => sum + price, 0)
3.Object.entries() - 获取键值对数组:
javascript
复制代码
const user = {
name: 'John',
age: 30
}
// 转换为键值对数组
const entries = Object.entries(user)
console.log(entries) // [['name', 'John'], ['age', 30]]
// 实际应用:转换为 Map
const userMap = new Map(Object.entries(user))
// 遍历键值对
Object.entries(user).forEach(([key, value]) => {
console.log(`${key}: ${value}`)
})
4.Object.assign() - 合并对象:
javascript
复制代码
// 基础合并
const target = { a: 1 }
const source = { b: 2 }
Object.assign(target, source)
console.log(target) // { a: 1, b: 2 }
// 多个源对象
const result = Object.assign({},
{ a: 1 },
{ b: 2 },
{ b: 3 } // 后面的会覆盖前面的
)
console.log(result) // { a: 1, b: 3 }
// 实际应用:克隆对象
const clone = Object.assign({}, original)
// 注意:这是浅拷贝
5.Object.freeze() - 冻结对象:
javascript
复制代码
const user = {
name: 'John',
age: 30
}
// 冻结对象
Object.freeze(user)
// 尝试修改会失败(严格模式下会报错)
user.name = 'Jane' // 无效
delete user.age // 无效
user.newProp = 'test' // 无效
// 检查是否冻结
console.log(Object.isFrozen(user)) // true
// 注意:只冻结一层
const nested = {
user: {
name: 'John'
}
}
Object.freeze(nested)
nested.user.name = 'Jane' // 仍然可以修改嵌套对象
6.Object.seal() - 密封对象:
javascript
复制代码
const user = {
name: 'John',
age: 30
}
// 密封对象
Object.seal(user)
// 可以修改现有属性
user.name = 'Jane' // 有效
// 但不能添加或删除属性
delete user.age // 无效
user.newProp = 'test' // 无效
// 检查是否密封
console.log(Object.isSealed(user)) // true
7.hasOwnProperty() - 检查自有属性:
javascript
复制代码
const user = {
name: 'John'
}
// 检查属性是否属于对象本身
console.log(user.hasOwnProperty('name')) // true
console.log(user.hasOwnProperty('toString')) // false
// 安全的检查方式
const has = Object.prototype.hasOwnProperty.call(user, 'name')
8.Object.defineProperty() - 定义属性:
javascript
复制代码
const user = {}
// 定义属性
Object.defineProperty(user, 'name', {
value: 'John',
writable: true, // 是否可写
enumerable: true, // 是否可枚举
configurable: true // 是否可配置
})
// 定义访问器属性
Object.defineProperty(user, 'fullName', {
get() {
return `${this.firstName} ${this.lastName}`
},
set(value) {
[this.firstName, this.lastName] = value.split(' ')
}
})
9.Object.create() - 创建对象:
javascript
复制代码
// 创建具有指定原型的对象
const person = {
sayHi() {
console.log('Hi!')
}
}
const user = Object.create(person, {
name: {
value: 'John',
writable: true
}
})
user.sayHi() // 继承的方法
10.解构和展开运算符:
javascript
复制代码
const user = {
name: 'John',
age: 30,
city: 'New York'
}
// 解构赋值
const { name, age } = user
// 重命名
const { name: userName } = user
// 默认值
const { country = 'USA' } = user
// 展开运算符
const clone = { ...user }
// 合并对象
const merged = { ...obj1, ...obj2 }