这是JavaScript中新的内置方法和函数-CSDN博客

In the past few years, JavaScript has come out with many new releases. They have brought new features particularly in the syntax and its core. These updates have made JavaScript more readable and clever. I will introduce us to the new methods for Arrays, Objects, and Strings. These new methods can handle data in an elegant and efficient way by writing less code. This what we are going to explain in this article.

在过去的几年中，JavaScript推出了许多新版本。它们带来了新功能，尤其是在语法及其核心方面。这些更新使JavaScript更具可读性和智能性。我将向我们介绍数组，对象和字符串的新方法。这些新方法可以通过编写更少的代码，以优雅而有效的方式处理数据。这就是我们将在本文中解释的内容。

新对象方法 (The new objects methods)

The Object is what makes JavaScript a powerful programming language. Objects allow you to group different datatypes. If you want to learn any new JavaScript framework like React, Vue, or Angular, you have to know how to use Objects and its methods. These frameworks use objects to get and handle user input. The new JavaScript releases bring new methods to Objects that make them more fun. Here are the new Object methods:

对象是使JavaScript成为强大的编程语言的原因。对象使您可以对不同的数据类型进行分组。如果您想学习任何新JavaScript框架，例如React，Vue或Angular，则必须知道如何使用Objects及其方法。这些框架使用对象来获取和处理用户输入。新JavaScript版本为对象带来了新的方法，使它们更加有趣。这是新的Object方法：

object.assign() (object.assign())

Object.assign() method has multiple jobs. It can copy an object, clone from another object, or concatenate two or more objects.

Object.assign()方法具有多个作业。它可以复制一个对象，从另一个对象克隆或连接两个或多个对象。

copy the values from another object:
复制另一个对象的值：

Clone an object to a new object
将对象克隆到新对象

Also, you can merge duplicate properties with Object.assign() by setting two empty brackets as the first argument:
另外，您可以通过将两个空括号设置为第一个参数，将重复属性与Object.assign()合并：

Object.entries() (Object.entries())

Object.entries() method returns the keys and values of the object as an Array.

Object.entries()方法以数组形式返回对象的键和值。

Object.getOwnPropertyDescriptors() (Object.getOwnPropertyDescriptors())

Object.getOwnPropertyDescriptors allow us to get the properties descriptor for an object.

Object.getOwnPropertyDescriptors允许我们获取对象的属性描述符。

It’s really helpful to check the property of the object descriptor, for example, see if it is writable or enumerable.

检查对象描述符的属性确实很有帮助，例如，查看它是否可写或可枚举。

新的Array方法 (The new Array methods)

The new JavaScript releases have provided new methods for Arrays. Here are the new array methods:

新JavaScript版本为数组提供了新的方法。这是新的数组方法：

Array.includes() (Array.includes())

Array.includes() allows us to check if a property exists in an array. You can see the difference between the old code and the new syntax (ES6). The new method is short and more readable.

Array.includes()允许我们检查数组中是否存在属性。您可以看到旧代码和新语法(ES6)之间的区别。新方法简短易读。

Array.find() (Array.find())

Array.find() helps us to find an element in an Array. It takes a callback function as an argument. The callback function provides more options to find and extract complex data.

Array.find()帮助我们在Array中查找元素。它以回调函数为参数。回调函数提供了更多选项来查找和提取复杂数据。

If the property we are looking for exists, it returns the found value. Otherwise, it returns undefined.

如果我们要查找的属性存在，它将返回找到的值。否则，它返回undefined。

Array.findIndex() (Array.findIndex())

Array.findIndex() returns the index of the found element instead of the value.

Array.findIndex()返回找到的元素的索引而不是值。

Array.values() (Array.values())

This new method returns an Array iterator of the values so we can run a for loop to extract each value of the Array.

这个新方法返回值的Array迭代器，因此我们可以运行for循环以提取Array的每个值。

Array.entries() (Array.entries())

Array.entries() returns both the key and value and in an Array format.

Array.entries()以数组格式返回键和值。

Array.from() (Array.from())

Array.from() was introduced in the ES6 release. It can do multiple things by running a map() function on the data. It can convert a String to an Array or even create a new Array from the data.

Array.from()在ES6版本中引入。它可以通过在数据上运行map()函数来执行多项操作。它可以将字符串转换为数组，甚至可以根据数据创建一个新的数组。

Array.keys() (Array.keys())

As the name implies, this method returns the keys of the Array.

顾名思义，此方法返回Array的键。

新的String方法 (The new String methods)

The new JavaScript releases provided new String methods. Here are the new String methods:

新JavaScript版本提供了新的String方法。这是新的String方法：

String.repeat() (String.repeat())

String.repeat() method allows you to repeat a string.

String.repeat()方法允许您重复一个字符串。

String.includes() (String.includes())

String.includes() works like Array.includes(). It returns a Boolean if the value entered exists.

String.includes()的工作方式类似于Array.includes()。如果输入的值存在，则返回布尔值。

新的Number方法 (The new Number methods)

The new JavaScript releases provided new Number methods. Here are the new Number methods:

新JavaScript版本提供了新的Number方法。这是新的Number方法：

Number.isNaN() (Number.isNaN())

This method was released in the ES6 update. It checks the Number value passed in and returns true if the value is NaN. Otherwise, it returns false. This method is inspired by the classic function isNAN() in JavaScript.

该方法已在ES6更新中发布。它检查传入的Number值，如果值为NaN，则返回true。否则，它返回false。此方法的灵感来自JavaScript中的经典函数isNAN()。

Number.isInteger() (Number.isInteger())

Like the previous method, Number.isInteger() checks to see if the value passed is an integer or not. It will return true if the value is an integer and false if it is not.

与前面的方法一样，Number.isInteger()检查传递的值是否为整数。如果该值为整数，则返回true，否则返回false。

Number.isSafeInteger() (Number.isSafeInteger())

You might always want to validate the users’ input to make sure it is a number. Number.isSafeInteger() checks if the number is a safe number.

您可能总是希望验证用户的输入以确保它是数字。 Number.isSafeInteger()检查数字是否为安全数字。

Learn more here

在这里了解更多

Number.isFinite() (Number.isFinite())

Number.isFinite() checks if the value passed in is a finite number or not.

Number.isFinite()检查传入的值是否为有限数字。

浏览器支持 (Browser support)

The new Number methods are almost supported by the major browser except for Opera Mini and IE-11. Support is shown in the image below:

主要的浏览器几乎都支持新的Number方法，但Opera Mini和IE-11除外。支持如下图所示：

新的特定对象 (New Specific objects)

JavaScript comes with new specific functions that allow us to write more performant code. Here are the new specific object methods:

JavaScript带有新的特定功能，使我们可以编写更多性能代码。这是新的特定对象方法：

Proxy()对象 (Proxy() object)

Proxy is one of the great additions to JavaScript. It creates a custom behavior for our code. With Proxy you can handle:

代理是JavaScript的重要补充之一。它为我们的代码创建了自定义行为。使用代理，您可以处理：

validating user data
验证用户数据
data correction
数据校正
property lookup
属性查询
assignment
分配
enumeration
枚举
function invocation
函数调用

Check other uses of Proxy and its methods here.

在此处检查Proxy及其方法的其他用途。

For understanding proxy, we are going to write two examples.

为了理解代理，我们将编写两个示例。

Example 1:

范例1：

In this example, we validate data while getting it from a user. We will try to define the behavior of an undefined error.

在此示例中，我们在从用户获取数据的同时验证数据。我们将尝试定义未定义错误的行为。

As you see in the example above userInfo.favCar returns undefined. What if we want to handle this error message? If we want to create a custom behavior for the error, for example, displaying another message instead of undefined, we can use Proxy in this case.

如上例所示，userInfo.favCar返回undefined 。如果我们要处理此错误消息怎么办？如果要为错误创建自定义行为，例如，显示另一条消息而不是未定义消息，则在这种情况下可以使用代理。

We defined a new proxy and gave it two arguments — the object and the handler. The handler runs some validation code and checks if the property exists in the object. It returns the property if it exists. Otherwise, it returns the message we defined and this is called property lookup.

我们定义了一个新的代理，并给它两个参数-对象和处理程序。处理程序将运行一些验证代码，并检查对象中是否存在该属性。如果属性存在，它将返回该属性。否则，它将返回我们定义的消息，这称为属性查找。

Example 2:

范例2：

In this example, we will create a validation for a specific value in the object using the set method.

在此示例中，我们将使用set方法为对象中的特定值创建一个验证。

In this example, we can validate the datatype and returns a new TypeError(). This makes debugging much easier. You can understand more with this helpful Article.

在此示例中，我们可以验证数据类型并返回一个新的TypeError()。这使调试更加容易。您可以通过这篇有用的文章了解更多信息。

浏览器支持 (Browser support)

Proxy works quite good for all major browser as you see below:

代理对于所有主流浏览器都非常有效，如下所示：

Set()对象 (Set() object)

The Set object is a new feature in JavaScript. It allows us to store unique values. It has a bunch of methods you can play. Object.add method lets you add a new property to the object. Object.delete removes a property from the object. Object.clear clears all properties from the object. The example below explains the object methods.

Set对象是JavaScript中的新功能。它允许我们存储唯一值。它有很多方法可以玩。 Object.add方法使您可以向对象添加新属性。 Object.delete从对象中删除属性。 Object.clear清除对象的所有属性。下面的示例说明了对象方法。

Learn more about Set() object here.

在此处了解有关Set()对象的更多信息。

结语 (Wrapping up)

We just covered the new built-in methods introduced by JavaScript. With these new great features, I don’t use the old syntax and methods anymore in my code. The new methods allow you to write proficient and performant JavaScript code in an elegant way.

我们刚刚介绍了JavaScript引入的新的内置方法。有了这些新的强大功能，我不再在代码中使用旧的语法和方法。这些新方法使您能够以优雅的方式编写精通而高效JavaScript代码。

You can check my articles about New ES6 syntax as well to refresh your skills in JavaScript.

您也可以查看有关新ES6语法的文章，以刷新您JavaScript技能。