五 JavaScript对象

五 对象

5.1 对象

原始值：

数值（Number）、大整数（BigInt）、字符串（String）、布尔值（Boolean）、空值（null）、

未定义（undefined）、符号（Symbol）

对象：

对象(Object)是JavaScript中的一种复合数据类型

它相当于一个容器，在对象中可以存储各种不同类型数据

创建一个对象：

let obj = Object()

对对象使用typeof会返回object

let obj = new Object()
console.log(typeof obj); // object

原始值只能用来表示一些简单的数据，不能表示复杂数据

比如：现在需要在程序中表示一个人的信息

let name = "Joe"
let age = 18
let gender = "男"
console.log(name); //Joe
console.log(age); // 18
console.log(gender); // 男

很复杂，但是可以放到一个对象中去：

let name = "Joe"
let age = 18
let gender = "男"

let obj = Object()
obj.name = name
obj.age = age
obj.gender =  gender
console.log(obj); // {name: 'Joe', age: 18, gender: '男'}

当然也可以：

let obj = Object()
obj.name = "Joe"
obj.age = 18
obj.gender =  "男"
console.log(obj); // {name: 'Joe', age: 18, gender: '男'}

对对象的增删改操作如下：

// 获取属性值
console.log(obj.name); // Joe
// 增加属性
obj.birthday = "24-1-31"
console.log(obj.birthday); // 24-1-31
// 修改属性
obj.birthday = "24-1-30"
console.log(obj.birthday); // 24-1-30
// 删除属性
delete obj.birthday
console.log(obj.birthday); // undefined

5.2 对象的属性

5.2.1 对象的属性

属性名：通常属性名就是一个字符串没有什么特殊要求但是如果你的属性名太特殊了，不能直接使用，需要使用[]来设置。虽然如此，但是我们还是强烈建议属性名也按照标识符的规范命名

以上是错误写法

以下是正确写法

let obj = Object()
obj['1'] = "Hello world"
console.log(obj['1']); // Hello world

ps：“1” 字符串1不可以作为变量名但是可以使用[]的方式成为对象的属性名

JavaScript中有两种数据结果，map和set，其本质就是object

也可以使用符号（symbol）作为属性名，来添加属性

let obj = Object()
let key = Symbol()
obj[key] = "Hello world"
console.log(obj[key]); // Hello world

属性值：对象的属性值可以是任意的数据类型，也可以是一个对象

let obj = new Object()
obj.test = 123 //Number类型
console.log(obj); // {test: 123}
obj.test = "123" //String类型
console.log(obj); // {test: '123'}
obj.test = true //Boolean类型
console.log(obj); // {test: true}
obj.test = 99999999999n //BigInt类型
console.log(obj); // {test: 99999999999n}
obj.test = null //null类型
console.log(obj);// {test: null}
obj.test = undefined //undefined类型
console.log(obj); // {test: undefined}
obj.test = Symbol() //symbol类型
console.log(obj); // {test: Symbol()}
obj.test = new Object //对象类型
console.log(obj); // {test: {…}}

5.2.2 in运算符

使用in运算符来检查对象中是否含有某个属性

语法：”属性名“ in obj

let obj = new Object()
obj.test = "test"
console.log("test" in obj); // true
console.log("name" in obj); //false

之后的之后会再次遇到in运算符，不过他在以后的以后学到原型链的时候才会遇到

注意：

let obj = new Object()
obj.test = "test"
let name = "test"
console.log(name in obj);
console.log("name" in obj); //false

5.3 对象的字面量

字面量是变量的字符串表示形式，他是一种变量的记法。差不多就算是等号右边的值

• 你可以直接使用{}来创建对象
• 使用{}所创建的对象，可以直接向对象中添加属性

语法：

{
	属性名：属性值
	[属性名]:属性值 // 暂时没想到这个`[]`的用处是什么，好像可加可不加？
}

let symbol = Symbol()
let obj = {
    name:"Joe",
    age:18,
    ["gender"]:"男",
    [symbol]:"特殊的属性",
    hello:{
        a:1,
        b:true
    }
}
console.log(obj); // {name: 'Joe', age: 18, gender: '男', hello: {…}, Symbol(): '特殊的属性'}
console.log(typeof obj); // object

属性名带[]与不带[]的区别（我猜的~~不知道怎么搜索…如果有懂哥请在评论区回答以下，蟹蟹~）

不带[]的会将属性转换成字符串，带[]会保留原格式，感觉就是针对Symbol类型的

var symbol = Symbol()
var obj = {
    [symbol]:"男",
}
var obj2 = {
    symbol:"男"
}

console.log(obj.symbol); // undefined
console.log(obj[symbol]); // 男
console.log(obj["symbol"]); // undefined

5.4 属性枚举

指将对象中所有的属性全部获取 for in

5.4.1 for-in语句

语法：

for(let propName in 对象){
	语句...
}

for-in的循环体会执行多次，有几个属性就会执行几次，每次执行时都会将一个属性名赋值给我们所定义的变量

• 并不是所有的属性都可以枚举，比如使用符号（symbol）添加的属性

let obj = {
    name:'孙悟空',
    age:18,
    gender:"男",
    address:"花果山",
    [Symbol()]:"测试的属性" // 符号添加的属性是不能枚举
}
for(let propName in obj){
    console.log(propName, obj[propName])
}
/**
输出：
	name 孙悟空
	age 18
	gender 男
	address 花果山
	------【没有输出"测试的属性"】
*/

5.5 可变类型

原始值都属于不可变类型，一旦创建就无法修改【在内存中不会创建重复的原始值】

let a = 10 // 1. 在内存里开辟一块空间存放10
let b = 10 // 2. 内存里已经有一块值为10的空间了，直接使用那块空间而不会重复创建
a = 12 // 3. 在内存重新开辟一块空间存放12，而变量b完全没有受到影响
b = 12 // 4. 与2.同理。而那块存放10的内存空间因为没有使用到，将会被垃圾回收机制（GC）销毁

let a = 10
let b = a
b = 100
console.log(a); //10 当我们对b赋值时，不会影响a

对象属于可变类型，对象创建完成后，可以任意的添加删除修改对象中的属性

注意：

• 当对两个对象进行相等或全等比较时，比较的是【对象的内存地址】
• 如果两个变量同时指向同一个对象，其中一个对该对象修改时，对另一个变量也会产生影响

let a = {animal:"猫"}
let b = a
b.animal = "狗"
console.log(a); // {animal: '狗'}  【但我们修改b时，a也受到了影响】

即：

当修改一个对象时，所有指向该对象的变量都会收到影响；

当修改一个变量时，只会影响当前的变量；

在使用变量存储对象时，很容易因为改变变量指向的对象，提高代码的复杂度，所以通常情况下，声明存储对象的变量时会使用const。

PS：const只是禁止变量被重新赋值，对对象的修改没有任何影响

const a = {animal:"猫"}
a = 666 // TypeError: Assignment to constant variable.

const a = {animal:"猫"}
a.animal = "狗"
console.log(a); // {animal: '狗'}

5.6 方法 method

当一个对象的属性指向一个函数，那么我们就称这个函数是该对象的方法

调用函数就称为调用对象的方法。

const a = {animal:"猫"}
a.sound = function () {
    console.log("喵喵喵");
}
a.sound() // "喵喵喵"