[JavaScript]回顾对象（+数组）

目录

1. 背景
2.环境
3. 什么是对象？
3-1.（补充）符号
4.如何使用对象
4-1. 添加
4-2. 取出
4-2-1. 仅值
4-2-2. 仅名称（键）
4-2-3. 整体
4-3. 检查是否有
4-4. 删除
5.数组和对象的区别
6.总结
7. 参考
8. 最后

1. 背景

我在工作中使用 JavaScript，
“关于对象的评论。”
一位负责教育的前辈告诉我。

因此，这次我想总结一下对象（+数组）。

2.环境

• windows 10 版本 21H2

3. 什么是对象？

JPrime解释如下：

对象是属性的集合。属性是一对名称（键）和值（值）。字符串或Symbol 可以用于属性键，并且可以为值指定任意数据。此外，一个对象可以具有多个属性，因此单个对象可以表示多种值。

创建并声明一个空对象。

const humanObj = {};

也可以设置初始值并创建并声明它，或者用花括号({}) 列出并声明它。

//　初期値を設定
const humanObj = new Object();
humanObj.name = "Taro";
humanObj.from = "Tokyo";
humanObj.year = 1989;

//　中括弧({})でリスト化
const humanObj = {
	// 名前（キー）: 値（バリュー）。キーのクォーテーションは省略可能。
	"name": "Taro",
    "from": "Tokyo",
    "year" : 1989
};

对象：具有键值对的属性集合

3-1.（补充）符号

它表示可以将字符串或Symbol 用作属性键。

符号特征是：

• 保证唯一（= 不重复）
• 值本身不能作为数据，必须调用toString()

const gender = Symbol();
const age = Symbol();
const humanObj = {
    "name": "Taro",
    "from": "Tokyo",
    "year" : 1989,
    [gender] : "man", // シンボル
    [age] : 35 // シンボル
};
console.log(gender); //Symbol()
console.log(age); //Symbol()
console.log(humanObj[gender]); //man
console.log(humanObj[age]); //35

我刚刚在代码中定义的humanObj 中添加了gender 和age。

您可以使用humanObj[gender] (オブジェクト[シンボル値]) 访问它。

当console.log();确认gender和age时，返回Symbol()，但toString()生成并输出字符串Symbol()。

所以它看起来一样，但内部不同。

其他

• 无法枚举（排除在 forEach 语句中）
• 无法转换为 JSON

还有一个方面反之，由于它没有被其他代码访问或覆盖，我认为根据情况使用它会很好。

*forEachメソッド：当你想重复处理时使用。与可以在任何地方使用的for 语句不同，它只能对数组数据执行。

4.如何使用对象

4-1. 添加

您可以附加点符号或括号符号。

让我们在每个符号的前面添加gender 和age 到humanObj。

const humanObj = {
	"name": "Taro",
    "from": "Tokyo",
    "year" : 1989
};
humanObj.gender = "man"; //ドット記法
humanObj["age"] = 35; //ブラケット記法
console.log(humanObj); //=> {name: 'Taro', from: 'Tokyo', year: 1989, gender: 'man', age: 35};

您可以添加オブジェクト.プロパティ 或オブジェクト["プロパティ"]。

如果您打印对象本身，您可以看到它已被添加。

4-2. 取出

以以下代码为基础。

const humanObj = {
	// 名前（キー）: 値（バリュー）。
	"name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

4-2-1. 仅值

const humanObj = {
	"name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

//取り出してみる
console.log(humanObj.gender); //=> man
console.log(humanObj["age"]); //=> 35

您可以通过オブジェクト.プロパティ 或オブジェクト["プロパティ"] 检索它。

如果您想将其作为数组获取，请使用Object.values() 获取。

const humanObj = {
	"name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

console.log(Object.values(humanObj));
//(5) ['Taro', 'Tokyo', 1989, 'man', 35]

4-2-2. 仅名称（键）

如果您想将其作为数组获取，请使用Object.keys() 获取。

const humanObj = {
	"name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

console.log(Object.keys(humanObj));
//(5) ['name', 'from', 'year', 'gender', 'age']

也可以结合forEachメソッド输出。

const humanObj = {
	"name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

const keys = Object.keys(humanObj); //一度配列にする
keys.forEach(key => {
    console.log(key);
});
//name
//from
//year
//gender
//age

4-2-3.总体

如果您想将其作为数组获取，请使用Object.entries() 获取。返回字符串键控的可枚举属性集[key, value]。

const humanObj = {
    "name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

for (const [key, value] of Object.entries(humanObj)) {
    console.log(`${key}: ${value}`);
}
//name: Taro
//from: Tokyo
//year: 1989
//gender: man
//age: 35

4-3. 检查是否有

在这里，我想做“检查是否有，如果没有则添加”。

我以in演算子为例介绍一下。
如果指定的属性存在于对象中，in演算子 返回 true。

const humanObj = {
    "name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

if ( "age" in humanObj === false ) {
    humanObj["age"] = 35;
} else {
    console.log("既に登録済みです"); //こちらが表示される
}

4-4. 删除

要删除时使用delete演算子。

您可以通过添加オブジェクト.プロパティ 或オブジェクト["プロパティ"] 并在其前面加上“delete”来删除它。

const humanObj = {
    "name": "Taro",
    "from": "Tokyo",
    "year": 1989,
    "gender": "man",
    "age": 35
};

delete humanObj.gender; //=> man を削除
delete humanObj["age"]; //=> 35 を削除
console.log(humanObj); //=> {name: 'Taro', from: 'Tokyo', year: 1989}

5.数组和对象的区别

数组：使用下标（索引）引用存储的数据。
索引从 0 开始。

const humanArr = ["Taro", "Tokyo", 35];
console.log(humanArr[0]); //=> Taro

对象：使用属性来引用存储的数据。

数组适用于仅按顺序排列的数字时要获取数据数量的情况，以及要集中处理多个数据或获取更具体的数据时的对象。

对于 JavaScript，数组包含在对象中。

6.总结

通过回顾对象，我的理解加深了。
另外，由于与数组的区别已经很明显，我想适当地使用它们。

7. 参考

8. 最后

如果您有任何错误，推荐的代码编写方法等，如果您能越来越多地告诉我，我将不胜感激。

感谢您的阅读！

原创声明：本文系作者授权爱码网发表，未经许可，不得转载;

原文地址：https://www.likecs.com/show-308623009.html

原文链接：https://www.likecs.com/show-308623009.html
本文来源 爱码网，其版权均为 原网址 所有 与本站无关，文章内容系作者个人观点，不代表 本站 对观点赞同或支持。如需转载，请注明文章来源。