当前位置: 首页 > article >正文

JavaScript 对象方法全面解析

JavaScript 是一种基于对象的编程语言,对象是 JavaScript 中最基本的数据结构之一。对象可以包含属性和方法,方法是对象的行为。本文将全面介绍 JavaScript 对象的所有常用方法,帮助你更好地理解和使用 JavaScript 对象。

文章目录

    • 1. 对象的基本方法
      • 1.1 `Object.assign()`
      • 1.2 `Object.create()`
      • 1.3 `Object.defineProperty()`
      • 1.4 `Object.defineProperties()`
      • 1.5 `Object.getOwnPropertyDescriptor()`
      • 1.6 `Object.getOwnPropertyNames()`
      • 1.7 `Object.getPrototypeOf()`
      • 1.8 `Object.setPrototypeOf()`
      • 1.9 `Object.is()`
      • 1.10 `Object.keys()`
      • 1.11 `Object.values()`
      • 1.12 `Object.entries()`
      • 1.13 `Object.freeze()`
      • 1.14 `Object.seal()`
      • 1.15 `Object.isFrozen()`
      • 1.16 `Object.isSealed()`
      • 1.17 `Object.preventExtensions()`
      • 1.18 `Object.isExtensible()`
    • 2. 对象的原型方法
      • 2.1 `hasOwnProperty()`
      • 2.2 `isPrototypeOf()`
      • 2.3 `propertyIsEnumerable()`
      • 2.4 `toLocaleString()`
      • 2.5 `toString()`
      • 2.6 `valueOf()`
    • 3. 对象的迭代方法
      • 3.1 `Object.keys()`
      • 3.2 `Object.values()`
      • 3.3 `Object.entries()`
    • 4. 对象的扩展方法
      • 4.1 `Object.fromEntries()`
      • 4.2 `Object.groupBy()`
    • 5. 总结

1. 对象的基本方法

1.1 Object.assign()

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

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target); // { a: 1, b: 4, c: 5 }
console.log(returnedTarget); // { a: 1, b: 4, c: 5 }

1.2 Object.create()

Object.create() 方法创建一个新对象,使用现有的对象作为新对象的原型。

const person = {
  isHuman: false,
  printIntroduction: function() {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  }
};

const me = Object.create(person);
me.name = 'Matthew';
me.isHuman = true;

me.printIntroduction(); // My name is Matthew. Am I human? true

1.3 Object.defineProperty()

Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。

const obj = {};

Object.defineProperty(obj, 'property1', {
  value: 42,
  writable: false
});

obj.property1 = 77; // Throws an error in strict mode

console.log(obj.property1); // 42

1.4 Object.defineProperties()

Object.defineProperties() 方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。

const obj = {};

Object.defineProperties(obj, {
  'property1': {
    value: true,
    writable: true
  },
  'property2': {
    value: 'Hello',
    writable: false
  }
});

console.log(obj.property1); // true
console.log(obj.property2); // Hello

1.5 Object.getOwnPropertyDescriptor()

Object.getOwnPropertyDescriptor() 方法返回指定对象上一个自有属性对应的属性描述符。

const obj = {
  property1: 42
};

const descriptor = Object.getOwnPropertyDescriptor(obj, 'property1');

console.log(descriptor.value); // 42
console.log(descriptor.writable); // true

1.6 Object.getOwnPropertyNames()

Object.getOwnPropertyNames() 方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括 Symbol 值作为名称的属性)组成的数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.getOwnPropertyNames(obj)); // ['a', 'b', 'c']

1.7 Object.getPrototypeOf()

Object.getPrototypeOf() 方法返回指定对象的原型(内部 [[Prototype]] 属性的值)。

const prototype1 = {};
const object1 = Object.create(prototype1);

console.log(Object.getPrototypeOf(object1) === prototype1); // true

1.8 Object.setPrototypeOf()

Object.setPrototypeOf() 方法设置一个指定的对象的原型(即内部 [[Prototype]] 属性)到另一个对象或 null

const obj = {};
const prototype = {};

Object.setPrototypeOf(obj, prototype);

console.log(Object.getPrototypeOf(obj) === prototype); // true

1.9 Object.is()

Object.is() 方法判断两个值是否为同一个值。

console.log(Object.is('foo', 'foo')); // true
console.log(Object.is({}, {})); // false

1.10 Object.keys()

Object.keys() 方法返回一个由一个给定对象的自身可枚举属性组成的数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.keys(obj)); // ['a', 'b', 'c']

1.11 Object.values()

Object.values() 方法返回一个给定对象自身的所有可枚举属性值的数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.values(obj)); // [1, 2, 3]

1.12 Object.entries()

Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.entries(obj)); // [['a', 1], ['b', 2], ['c', 3]]

1.13 Object.freeze()

Object.freeze() 方法可以冻结一个对象。一个被冻结的对象再也不能被修改。

const obj = {
  prop: 42
};

Object.freeze(obj);

obj.prop = 33; // Throws an error in strict mode

console.log(obj.prop); // 42

1.14 Object.seal()

Object.seal() 方法封闭一个对象,阻止添加新属性并将所有现有属性标记为不可配置。当前属性的值只要原来是可写的就可以改变。

const obj = {
  prop: 42
};

Object.seal(obj);

obj.prop = 33;
console.log(obj.prop); // 33

delete obj.prop; // Cannot delete when sealed
console.log(obj.prop); // 33

1.15 Object.isFrozen()

Object.isFrozen() 方法判断一个对象是否被冻结。

const obj = {
  prop: 42
};

Object.freeze(obj);

console.log(Object.isFrozen(obj)); // true

1.16 Object.isSealed()

Object.isSealed() 方法判断一个对象是否被密封。

const obj = {
  prop: 42
};

Object.seal(obj);

console.log(Object.isSealed(obj)); // true

1.17 Object.preventExtensions()

Object.preventExtensions() 方法让一个对象变的不可扩展,也就是永远不能再添加新的属性。

const obj = {};

Object.preventExtensions(obj);

obj.newProp = 'new'; // Throws an error in strict mode

console.log(obj.newProp); // undefined

1.18 Object.isExtensible()

Object.isExtensible() 方法判断一个对象是否是可扩展的(是否可以在它上面添加新的属性)。

const obj = {};

console.log(Object.isExtensible(obj)); // true

Object.preventExtensions(obj);

console.log(Object.isExtensible(obj)); // false

2. 对象的原型方法

2.1 hasOwnProperty()

hasOwnProperty() 方法返回一个布尔值,指示对象自身属性中是否具有指定的属性。

const obj = {
  prop: 42
};

console.log(obj.hasOwnProperty('prop')); // true
console.log(obj.hasOwnProperty('toString')); // false

2.2 isPrototypeOf()

isPrototypeOf() 方法用于测试一个对象是否存在于另一个对象的原型链上。

function Foo() {}
function Bar() {}

Bar.prototype = Object.create(Foo.prototype);

const bar = new Bar();

console.log(Foo.prototype.isPrototypeOf(bar)); // true
console.log(Bar.prototype.isPrototypeOf(bar)); // true

2.3 propertyIsEnumerable()

propertyIsEnumerable() 方法返回一个布尔值,表示指定的属性是否可枚举。

const obj = {
  prop: 42
};

console.log(obj.propertyIsEnumerable('prop')); // true
console.log(obj.propertyIsEnumerable('toString')); // false

2.4 toLocaleString()

toLocaleString() 方法返回一个该对象的字符串表示。此方法旨在派生对象为了特定语言环境的目的而重载使用。

const date = new Date();

console.log(date.toLocaleString()); // "7/25/2023, 2:30:00 PM"

2.5 toString()

toString() 方法返回一个表示该对象的字符串。

const obj = {};

console.log(obj.toString()); // "[object Object]"

2.6 valueOf()

valueOf() 方法返回指定对象的原始值。

const obj = {
  value: 42,
  valueOf: function() {
    return this.value;
  }
};

console.log(obj.valueOf()); // 42

3. 对象的迭代方法

3.1 Object.keys()

Object.keys() 方法返回一个由一个给定对象的自身可枚举属性组成的数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.keys(obj)); // ['a', 'b', 'c']

3.2 Object.values()

Object.values() 方法返回一个给定对象自身的所有可枚举属性值的数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.values(obj)); // [1, 2, 3]

3.3 Object.entries()

Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.entries(obj)); // [['a', 1], ['b', 2], ['c', 3]]

4. 对象的扩展方法

4.1 Object.fromEntries()

Object.fromEntries() 方法把键值对列表转换为一个对象。

const entries = [
  ['a', 1],
  ['b', 2],
  ['c', 3]
];

const obj = Object.fromEntries(entries);

console.log(obj); // { a: 1, b: 2, c: 3 }

4.2 Object.groupBy()

Object.groupBy() 方法根据提供的回调函数对对象的属性进行分组。

const obj = {
  a: 1,
  b: 2,
  c: 3
};

const grouped = Object.groupBy(obj, (value, key) => {
  return value % 2 === 0 ? 'even' : 'odd';
});

console.log(grouped); // { odd: [1, 3], even: [2] }

5. 总结

JavaScript 对象提供了丰富的方法来操作和管理对象的属性和行为。通过掌握这些方法,你可以更高效地处理对象数据,编写出更加健壮和可维护的代码。希望本文对你理解和使用 JavaScript 对象方法有所帮助。

如果你有任何问题或建议,欢迎在评论区留言讨论!


参考文献:

  • MDN Web Docs: Object
  • JavaScript: The Definitive Guide

版权声明: 本文为原创文章,版权归作者所有。转载请注明出处!


http://www.kler.cn/a/543506.html

相关文章:

  • 亚信安全正式接入DeepSeek
  • 在大型语言模型(LLM)框架内Transformer架构与混合专家(MoE)策略的概念整合
  • π 的奥秘:如何用有理数逼近无理数?
  • 服务器,交换机和路由器的一些笔记
  • vue 主子表加校验问题
  • Visual Studio 使用 “Ctrl + /”键设置注释和取消注释
  • 【蓝耘平台与DeepSeek强强联手】:深度探索AI应用实践
  • 网络安全 | SNI介绍及F5中的配置应用
  • 【Day38 LeetCode】动态规划DP 子序列问题Ⅱ
  • java lambda表达式
  • 电机实验曲线数据提取
  • 3、《Spring Boot 常见注解详解》
  • Node.js中的npm包:从入门到实践指南
  • 《qt open3d中添加半径滤波》
  • QGIS 导入表格乱码问题的全面解析与解决方案
  • 第一天:爬虫介绍
  • 详细解释一下HTTPS握手过程中的密钥交换?
  • 蓝桥杯(B组)-每日一题
  • Day84:数据可视化
  • 【Golang学习之旅】Go + Redis 的缓存设计与优化
  • 数据序列比大小
  • Java分布式幂等性怎么设计?
  • 前端实现在PDF上添加标注(1)
  • 如何启动 Linux Debian/Ubuntu 等 SSH 服务器
  • TypeScript 中的 reduce计算统计之和
  • 【VASP】VASP结合Phonopy计算自由能、热容和熵