天天看点

6种你应该知道的强大JavaScript对象方法

6种你应该知道的强大JavaScript对象方法

英文 | https://javascript.plainenglish.io/the-6-powerful-javascript-object-methods-that-you-should-know-b2a659ddf3b5

翻译 | web前端开发

与任何其他编程语言一样,JavaScript具有自己的数据类型,例如,数字,字符串,数组,对象等。这些数据类型使开发人员可以使用数据并用该语言实现许多有用的功能。

对象是JavaScript中非常重要的数据类型,它们具有许多有用的内置方法,我们可以使用和访问这些方法,以帮助开发人员更轻松地处理对象。

这就是为什么在本文中,我们将学习一些你应该在JavaScript中了解的有用的对象方法。

现在,让我们开始吧。

1、Object.keys( )

该方法Object.keys( )(大写的O)用于返回一个数组,该数组包含我们作为参数传递给它的特定对象的所有键。

让我们看下面的例子:

const employee = {
  name: "James",
  age: 25,
  available: true
}
//Print the keys in the console
console.log(Object.keys(employee));
//output: ["name", "age", "available"]      

如你在上面的示例中看到的,我们得到一个包含键作为输出的数组。现在,你可以使用任何其他数组方法来访问和迭代键。

由于对象不具有length属性,因此,你也可以通过Object.keys( )用来获取对象的长度。

示例如下:

Object.keys(employee).length; //3      

2、Object.freeze( )

该方法Object.freeze( )防止对象中的数据突变。因此,你不能将Object.freeze( )作为参数传递给对象,更不能添加,更新或删除属性。

看下面的例子:

const employee = {
  name: "James",
  age: 25,
  available: true
}
//Freezing the object.
Object.freeze(employee);
//updating and adding properties.
employee.name = "Brad";
employee.newProp = "Hard Worker";
console.log(employee);
//Output: {name: "James", age: 25, available: true}      

如你所见,即使我们更新了属性,该对象也不会更改。

3、Object.seal( )

该方法Object.seal( )有点类似于Object.freeze( )。它可以防止向对象添加新属性,但是可以更改和更新现有属性。

const user = {
  name: "Alex",
  age: 23,
  isOnline: false
}
//使用Object.seal()
Object.seal(user);
//更新属性。
user.isOnline = true;
//添加一个属性。
user.active = false;
console.log(user);
//输出:{名称:“ Alex”,年龄:23,isOnline:true}      

该属性isOnline已更新,但是我们无法将该属性添加active到对象中,因为我们使用Object.seal( )它来防止这种情况的发生。

4、Object.values( )

该方法Object.values()允许你将对象内的所有值作为数组获取。你只需要将对象作为参数传递给方法Object.values()。

这是一个例子:

const user = {
  name: "Alex",
  age: 23,
  isOnline: false
}
console.log(Object.values(user));
//output: ["Alex", 23, false]      

如你所见,你将获得一个对象值数组。现在,你可以使用该数组执行任何操作。

5、Object.entries( )

该方法Object.entries()也是有用的。它允许你同时获取对象的键和值,并返回一个多维数组,该多维数组包含每个键和值的其他数组。

让我们看一个实际的例子:

const user = {
  name: "Alex",
  age: 23,
  isOnline: false
}
console.log(Object.entries(user));
//output: [["name", "Alex"], ["age", 23], ["isOnline", false]]      

如你在示例中所见,该方法Object.entries( )允许我们将键和值作为数组获取。

6、Object.create( )

该方法Object.create()用于从另一个现有对象的原型创建一个新对象。

看下面的例子:

const user = {
  firstName: "John",
  lastName: "Doe",
  age: 25,
  fullName(){
    return `${this.firstName} ${this.lastName}`;
  }
}
//新对象。
let newObject = Object.create(user);
//更新属性。
newObject.firstName = "Mehdi";
newObject.lastName = "Aoussiad";
//我们也可以在此新对象中使用user的fullName方法。
newObject.fullName();  //输出:Mehdi Aoussiad
console.log(newObject);
//输出:{firstName:“ Mehdi”,lastName:“ Aoussiad”}      

在上面的示例中,我们用于Object.create()创建一个具有用户对象原型的新对象。这就是为什么我们能够更改属性并user在新对象中使用对象的方法的原因。如果你不想在对象中复制代码,这将非常有用。

结论

如你所见,这些对象方法在JavaScript中很有用,因为它们能够帮助开发人员更轻松地处理对象。在某些情况下,你肯定需要使用这些方法。

感谢您阅读本文。希望你觉得它有用。

本文完〜

6种你应该知道的强大JavaScript对象方法

继续阅读