什么是Javascript中的 "in "运算符?

453 阅读5分钟

每当你处理JavaScript对象或字典时,你总是要处理从该对象或集合中搜索出特定记录的问题。有时,你需要访问特定的属性,并在某个地方使用它来在用户界面或前端显示它们。

因此,我们使用JavaScript,所以实现这个功能变得非常容易,因为JavaScript为我们提供了''in''操作符,这在这方面很有帮助,我们可以通过在我们的JavaScript代码中的任何地方使用这个 "in "操作符来实现同样的功能。

让我们深入了解一下这个操作符是如何工作的,以及我们如何轻松地使用它来从数组或对象中获取特定的值或属性。

in'' 操作符的对象是什么?

in操作符是JavaScript中的一个实用操作符,用于检查特定数组或JavaScript对象中是否存在某个属性。它的响应是布尔型的,这意味着如果搜索成功并且在对象中找到了一个元素,它将返回真,否则,如果该特定元素不存在于集合中,它将返回假。

在这篇文章中,我们将看看 "in "操作符是如何工作的,以及我们如何轻松地利用这个操作符来测试我们需要的功能。

在本教程中,我们假设你已经基本了解了什么是JavaScript对象,以及我们如何在JavaScript中轻松地创建自己的对象,并对继承的工作方式有基本的了解。因为,"in "操作符也可以帮助我们在一些类中找到一些方法或对象。我们将在下面的程序中介绍一些基础知识,但我们仍然建议对继承有一定的了解,以便理解 "in "运算符的进一步概念。

什么时候应该使用 "in "运算符?

JavaScript的''in''操作符也可以用来检查是否有一个函数或方法附在某个类的实例上,这意味着每当你需要检查这种情况时,你都会选择使用 "in"操作符的方法,因为它是一个原型链,可以很容易地提供给你所需的结果。

JavaScript原型链是对象和对象实例如何获得不是它们自己的属性和函数的访问。__proto__属性允许你访问这些对象的构造函数或原型中定义的属性和方法。

让我们举个例子,看看in操作符在代码中是如何工作的,以及我们如何在代码中轻松地使用它来拥有所需的功能。

例子

要确定一个项目是否有一个给定的属性。

const person = {

  name: 'johndoe',

  age: 21,

  phone: '123456789',

  start: () =>{

    console.log(`Name ${this.name}, age ${this.age} and phone is ${this.phone}`);

  }

}


 
console.log('name' in person)

console.log('start' in person)

console.log('johndoe' in person)

在上面的代码中,我们简单地创建了一个人的数组,其中包含一些属性,如姓名、年龄、电话,还有一个方法,在终端上记录了一些人的信息。

后来,我们通过使用in操作符检查了一些属性,如果它们存在于对象中。第一个控制台将返回true,因为name 是存在于上述person对象中的一个属性,而start 也是person对象中的一个属性。

但是最后一个console.log不会返回真,而是会返回假,因为johndoe 不是person对象中的一个属性,它是对象中name 属性的值,因此这就是johndoe不会返回真的原因。

你也可以看一下下面的输出屏幕来验证。

输出

JavaScript in操作符检查数组的值是使用键还是索引

JavaScript的 "in"操作符也可以对数组起作用。到目前为止,我们已经讨论了它,并且用对象实现了这个例子,但是它对数组的作用也几乎是一样的。在JavaScript中,数组是一个对象的原型或实例,换句话说,你可以把JavaScript中的所有东西都看作是对象的实例。

这听起来很奇怪,但让我们在浏览器的控制台中用一个简单的应用程序来测试一下。

例子

首先,创建一个数组,并使用instanceof操作符来查看它是否是Object类型的实例。

const array = [1, 2, 3, 4];

console.log(array instanceof Object) // Returns true

在上面的例子中,我们创建了一个数组,然后在console.log中检查它是否是对象的实例。

请看下面的输出

输出

会出现一组属性,其中一个是__proto__,它链接到Array。我们也可以打开它,在列表中继续前进,直到我们找到另一个__proto__属性,其值为Object。

现在让我们再次回到in运算符,用JavaScript数组测试这个运算符。

const array = [1, 2, 3, 4];

console.log('Yes 3 is in the array :',3 in array)

console.log('Yes 2 is in the array :',2 in array)

console.log('filter' in array)

在上面的代码中,我们创建了一个有1、2、3和4的数组,并使用in操作符测试这些值是否存在于数组中。

输出

之后,我们得到了所有的响应,并打印在输出屏幕上,因为我们所检查的所有值都存在于数组集合中。

总结

JavaScript的 "in "操作符是用来检查一个对象中是否存在一个特定的属性。in "操作符的反应是一个布尔值,这意味着如果该值存在于对象中,它将返回真,如果该特定值不存在,则返回假。在这篇文章中,我们已经看到了in操作符在对象和数组上的工作,并详细讨论了它的一些例子。