Object方法——集合

权泉全
89 阅读6分钟

Object.keys()

作用：

  • Object.keys() 是 JavaScript 中的一个内置函数，它用于返回对象自身可枚举属性的键名（属性名）组成的数组。换句话说，它可以提取一个对象所有可遍历（枚举）的键名，并以数组形式返回
  • 具体来说，当一个属性的 enumerable 属性值为 true 时，它就是可枚举属性。
  • 注意，JavaScript 中的某些内置对象，比如 Array 和 RegExp，也有一些非常有用的可枚举属性。但是，在自己创建对象时，默认情况下，所有属性都是可枚举的，除非你显式地将它们设置为不可枚举。

语法：

const obj = {
  name: 'Alice',
  age: 30,
  gender: 'female'
};

const keys = Object.keys(obj);
console.log(keys); // ['name', 'age', 'gender']
  • 在上述示例中，Object.keys(obj) 会返回一个由 obj 对象的可枚举属性键名组成的数组 ['name', 'age', 'gender']。

Object.values()

作用：

  • 在 JavaScript 中，Object.values() 是一个用于返回指定对象自身可枚举属性的值的方法。它将对象的属性值作为数组返回，按照属性添加顺序排列。例如：
const obj = { a: 1, b: 2, c: 3 }; 
console.log(Object.values(obj)); // [1, 2, 3]

注意：

  • 该方法只返回对象自身的可枚举属性的值，不包括从原型链继承的属性。如果需要获取所有属性（包括不可枚举的属性和从原型链继承来的属性），可以使用 Object.getOwnPropertyNames() 方法。

JSON

JSON.stringify()

作用：

  • JSON.stringify() 的作用是将一个 JavaScript 对象转换成 JSON 格式的字符串。它接受一个对象作为输入并返回一个包含该对象的 JSON 表示的字符串。生成的 JSON 字符串可用于不同应用程序之间的数据交换或发送到服务器进行存储。

语法：

JSON.stringify(obj, replacer, space)
  • 其中，第一个参数 obj 是要序列化成 JSON 格式字符串的 JavaScript 对象；第二个参数 replacer 是一个函数或数组，用来控制转换过程中需要忽略的属性或进行转换的值；第三个参数 space 是一个（可选参数），用来指定生成的 JSON 字符串的缩进格式。

示例：要将一个 JavaScript 对象转换成 JSON 格式的字符串并输出到控制台

const obj = { name: 'John', age: 30 };
const jsonStr = JSON.stringify(obj);

console.log(jsonStr);
// 输出：{"name":"John","age":30}
  • 如果想让生成的 JSON 字符串更易读，可以添加缩进格式：
const obj = { name: 'John', age: 30 };
const jsonStr = JSON.stringify(obj, null, 2); // 使用两个空格作为缩进格式

console.log(jsonStr);
// 输出：
// {
//   "name": "John",
//   "age": 30
// }

json.parse()

作用：

  • JSON.parse() 方法是将 JSON 格式的字符串转换为相应的 JavaScript 对象或值。它接受一个字符串作为参数，并返回解析后的 JavaScript 对象。

示例：

  • 例如，假设有以下 JSON 字符串：
const jsonString = '{"name": "John", "age": 30}';
  • 我们可以使用 JSON.parse() 将其转换为一个 JavaScript 对象：
const obj = JSON.parse(jsonString);
console.log(obj.name); // 输出 "John"
console.log(obj.age); // 输出 30
  • 注意：
  • 如果传递给 JSON.parse() 的字符串不是有效的 JSON 格式，则会引发语法错误。

遍历对象

for...in

  • 示例：
const person = {
  name: "John",
  age: 30,
  gender: "male"
};


for (let key in person) {
  console.log(key + ": " + person[key]);
}
  • 输出为：
name: John
age: 30
gender: male

Object.keys()

const keys = Object.keys(person);
for (let i = 0; i < keys.length; i++) {
  const key = keys[i];
  console.log(key + ": " + person[key]);
}
  • 输出也为：
name: John
age: 30
gender: male

注意：

  • 在遍历对象时，可能会遇到对象原型链上的属性。为了避免这种情况，可以使用 hasOwnProperty() 方法检查属性是否属于该对象。例如：
for (let key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(key + ": " + person[key]);
  }
}

Object.assign()

语法：

Object.assign(target, ...sources)
  • 其中，target 是目标对象，...sources 是一个或多个源对象。Object.assign() 方法会将所有源对象的可枚举属性复制到目标对象中，并返回目标对象。

示例：

  • 以下代码使用 Object.assign() 方法将两个对象合并成一个新对象：
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const obj3 = Object.assign({}, obj1, obj2);
console.log(obj3); // { a: 1, b: 2, c: 3, d: 4 }
  • 在上面的示例中，我们创建了两个对象 obj1 和 obj2，然后使用 Object.assign() 方法将它们合并到一个新对象 obj3 中。我们将空对象 {} 作为第一个参数传递给 Object.assign() 方法，以确保不修改任何现有的对象。

obj.hasOwnProperty()

作用：

  • hasOwnProperty 是 JavaScript 中对象的一个方法，用于检查对象自身是否具有指定名称的属性（不包括继承的属性）。

语法：

  • obj.hasOwnProperty('prop')
  • 其中，obj 是要检查的对象，prop 是要检查的属性名。

返回值：

  • 如果对象 obj 自身具有指定名称的属性 prop，则返回 true。
  • 果对象 obj 自身不具有指定名称的属性 prop，或者 obj 不是一个对象（如 null 或 undefined），则返回 false。

Object.create（）

作用：

  • Object.create() 是 JavaScript 中的一个静态方法，用于创建一个新对象，并将该对象的原型设置为指定的原型对象。

语法：

Object.create(proto, [propertiesObject])
  • proto 是新对象的原型对象，即新对象将继承自该原型对象。
  • propertiesObject 是可选参数，用于定义新对象的属性。该参数的每个属性都是通过描述符对象定义的。

示例：

const person = {
  name: 'Alice',
  sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

const alice = Object.create(person);
alice.name = 'Alice';

alice.sayHello(); // 输出 "Hello, my name is Alice"
  • alice 对象继承了 person 对象的属性和方法。我们可以通过给 alice 对象设置 name 属性来覆盖继承的 name 值。最后，调用 alice.sayHello() 将输出 "Hello, my name is Alice"，表示继承和方法调用成功。

Object.defineProperty()

  • Object.defineProperty() 是 JavaScript 中的一个方法，用于定义或修改对象的属性。

该方法接受三个参数：

  1. 对象：要定义或修改属性的对象。
  2. 属性名：要定义或修改的属性的名称。
  3. 属性描述符：用于定义或修改属性的配置对象

属性描述符:

  • 属性描述符是一个包含属性特性的对象，可以包含以下属性：
  • value：设置属性的值。
  • writable：如果为 true，属性的值可以被修改。默认为 false。
  • enumerable：如果为 true，属性可以被枚举（使用 for...in 或 Object.keys()）。默认为 false。
  • configurable：如果为 true，属性可以被删除，属性特性可以被修改，或者可以重新定义为访问器属性。默认为 false。
  • get：定义属性的 getter 函数。
  • set：定义属性的 setter 函数。

示例：

const obj = {};

Object.defineProperty(obj, 'name', {
  value: 'John',
  writable: false,
  enumerable: true,
  configurable: true
});

console.log(obj.name); // 输出: John

obj.name = 'Alice'; // 这里会抛出 TypeError，因为属性是只读的

for (let key in obj) {
  console.log(key); // 输出: name
}
  • 在上述示例中，我们使用 Object.defineProperty() 方法在 obj 对象上定义了一个名为 name 的属性。该属性的值为 'John'，是只读的（writable: false），可枚举的（enumerable: true），可配置的（configurable: true）。
  • 请注意，Object.defineProperty() 方法只能定义或修改单个属性。如果需要定义或修改多个属性，可以使用 Object.defineProperties() 方法。

Object.defineProperties()

  • Object.defineProperties() 是 JavaScript 中的一个方法，用于定义或修改对象的多个属性。

该方法接受两个参数：

  1. 对象：要定义或修改属性的对象。
  2. 属性描述符对象：一个包含多个属性描述符的对象。
  • 属性描述符对象是一个键值对的集合，其中键是要定义或修改的属性名称，值是包含属性特性的对象。

每个属性描述符对象可以包含以下属性：

  • value：设置属性的值。
  • writable：如果为 true，属性的值可以被修改。默认为 false。
  • enumerable：如果为 true，属性可以被枚举（使用 for...in 或 Object.keys()）。默认为 false。
  • configurable：如果为 true，属性可以被删除，属性特性可以被修改，或者可以重新定义为访问器属性。默认为 false。
  • get：定义属性的 getter 函数。
  • set：定义属性的 setter 函数。

示例：

const obj = {};

Object.defineProperties(obj, {
  name: {
    value: 'John',
    writable: false,
    enumerable: true,
    configurable: true
  },
  age: {
    value: 30,
    writable: true,
    enumerable: true,
    configurable: true
  }
});

console.log(obj.name); // 输出: John
console.log(obj.age); // 输出: 30
  • 在上述示例中，我们使用 Object.defineProperties() 方法在 obj 对象上定义了两个属性：name 和 age。每个属性都使用属性描述符对象进行配置。
  • 通过使用 Object.defineProperties() 方法，我们可以一次性定义或修改多个属性，而不必逐个使用 Object.defineProperty() 方法。
avatar
文章
阅读
粉丝