迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

在 JavaScript 中列出对象属性

作者:迹忆客 最近更新:2023/03/10 浏览次数:

JavaScript 提供了各种处理对象的方法,例如 Object.values()Object.prototype.valueOf() 来处理对象值,Object.keys()Object.prototype.hasOwnProperty() 使用对象键。

用户可以对对象键和属性执行任何操作。本教程解释了在 JavaScript 中使用 for...in 循环、Object.getOwnPropertyNames()Object.keys() 函数列出对象属性。

要列出对象的属性,你可以使用 JavaScript 中的 for...in 循环。for...in 循环遍历对象的可枚举属性。

这些是 enumerable 标志设置为 true 的对象的属性。这包括继承的可枚举属性。但是,此循环忽略了 enumerable 标志设置为 false 的不可枚举属性。

例如,让我们创建一个具有三个属性的对象并使用 for...in 循环列出它。请参阅下面的代码。

语法:

for (variable in object) {
  statement
}

该函数迭代 object,并且每次迭代都为 variable 分配不同的属性名称。此方法仅从 object 中提取可枚举属性。

有关更多信息,请阅读有关 for...in 方法的更多信息。

const inputObject = {
    id: 42,
    name: 'John Doe',
    address: {
    	city: "Mumbai",
        country: "India"
    }
};
for (const property in inputObject) {
  console.log(property);
}

在上面的示例代码块中,我们定义了对象的三个属性 - idnameaddress。当你迭代 inputObject 时,inputObject 中的所有属性都会被检查。

上面代码块的输出将如下所示。

输出:

id
name
address

这是 JavaScript 提供的一种内置方法,用于提取对象的属性或键。它迭代对象并返回一个可枚举属性的数组。

不可枚举属性是在循环中使用 Object.keys()for ...in 传递相应对象时未出现在循环中的对象的属性。

语法:

Object.keys(object);

这个函数接受一个 object 作为输入,它是一个强制参数。此方法仅从 Object 中提取可枚举属性。

有关更多信息,请阅读有关 keys 方法的更多信息。

const inputObject = {
    id: 42,
    name: 'John Doe',
    address: {
    	city: "Mumbai",
        country: "India"
    }
};

Object.defineProperty(inputObject, 'salary',{
    value : '30,000$',
    enumerable: false
})

console.log(Object.keys(inputObject));

在前面的示例中,我们定义了对象 IDnameaddress 的三个属性。当你传递 inputObject 时,会检查 inputObject 的所有属性。

上面代码块的输出将如下所示。

输出:

["id", "name", "address"]

这是 JavaScript 提供的一种内置方法,用于提取对象的属性或键。它迭代对象并返回一个属性数组,包括不可枚举的属性。

语法:

Object.getOwnPropertyNames(object);

此函数将强制参数 object 作为输入。此方法仅提取 Object 的可枚举和不可枚举属性,而不提取值。

有关更多信息,请阅读有关 getOwnPropertyNames 方法的更多信息。

getOwnPropertyNames()Object.keys() 之间的主要区别在于 getOwnPropertyName() 返回可枚举和不可枚举的属性。而 Object.keys() 只返回可枚举的键。

可以使用 Object.defineProperty 创建不可枚举的属性。当属性初始化程序初始化属性时,enumerable 标志设置为 true

你可以使用 propertyIsEnumerable() 方法来检查对象是否包含可枚举或不可枚举的属性。

const inputObject = {
    id: 42,
    name: 'John Doe',
    address: {
    	city: "Mumbai",
        country: "India"
    }
};

Object.defineProperty(inputObject, 'salary',{
    value : '30,000$',
    enumerable: false
})

console.log(Object.getOwnPropertyNames(inputObject));

在前面的示例中,我们定义了对象 IDnameaddress 的三个属性。当你传递 inputObject 时,会检查 inputObject 的所有属性和不可枚举的属性。

上面代码块的输出将如下所示。

输出:

["id", "name", "address", "salary"]

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

Do you understand JavaScript closures?

发布时间:2025/02/21 浏览次数:108 分类:JavaScript

The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.

Do you know about the hidden traps in variables in JavaScript?

发布时间:2025/02/21 浏览次数:178 分类:JavaScript

Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av

How much do you know about the Prototype Chain?

发布时间:2025/02/21 浏览次数:150 分类:JavaScript

The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start

用 jQuery 检查复选框是否被选中

发布时间:2024/03/24 浏览次数:102 分类:JavaScript

在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便