JavaScript 对象拯救计划：从"对象恐惧症"到"对象操纵大师"！

​​欢迎来到JavaScript对象宇宙！​​

你是否有过这样的经历？

• 写代码时，变量散落一地，像家里没收拾的袜子，东一只西一只 🧦
• 想给数据"打包"，结果搞出一堆混乱的数组和独立变量，自己都看不懂 🤯
• 看到别人优雅的代码，对象嵌套对象，像俄罗斯套娃一样工整，而你的代码却像乐高积木散落一地 🧩 别担心！

​​JavaScript对象就是你的数据收纳神器！​​ 🧳✨

为什么你需要对象？​​

想象一下：

• ​没有对象​ → 你的代码就像单身公寓，所有东西都挤在一起，毫无隐私可言 🏠🚪
• ​有了对象​ → 你的代码秒变豪华别墅，数据分层管理，各司其职 🏡✨

​​学完对象，你能做什么？​​

• ​组织数据​：让代码像衣柜一样整齐，T恤归T恤，裤子归裤子 👕👖
• ​封装功能​：把函数和方法打包进对象，像瑞士军刀一样多功能 🔪✨
• ​玩转API​：轻松处理JSON数据，不再被复杂结构吓到 😎
• ​进阶OOP​：面向对象编程，让你的代码像乐高一样可拼装 🧱

🤹 ​​对象其实很有趣！​​

• 它们可以​动态添加属性​，像魔法口袋一样想装什么装什么 🎩
• 它们能​嵌套​，像俄罗斯套娃，对象里面还能藏对象 🪆
• 它们甚至能​借用方法​，像邻居之间借个酱油一样方便 🏠

创建对象的方法

1、对象字面量

# var obj = {
    name : 'ZHT'
    age : 18
    console.log(obj['age'])  // 注意如果直接age   age会看成变量   必须加引号
}

2. new Object()

let obj = new Object()
obj.key1 = value1
obj.key2 = value2

3. 自定义函数构造函数

//构造函数
var  Person = function (name, age) {
  this.name = name
  this.age = age
}
//调用
var p1 = new Person('ZHT',18)
//输出
console.log(p1)    // person { name: 'ZHT', age: 18 }

用途

• 当需要批量化生产对象时，使用构造函数

• 当一个函数被new调用时，这个函数就是构造函数

构造函数命名约定​​：

• 通常以大写字母开头

• 这有助于区分普通函数和构造函数

new 关键字的作用​​：

• 创建一个新对象

• 将新对象的 __proto__ 指向构造函数的 prototype

• 将 this 绑定到新对象

• 如果构造函数没有显式返回对象，则返回 this

对象的一些方法

1、增加属性 : 对象名.属性名 = 属性值

obj.sex = '男'  //向obj里面增加了一个sex属性，属性值为男。

2、删除属性 : delete 对象名.属性名

delete obj.age  //删除了obj里面的年龄属性。

3、修改属性 : 对象名.属性名 = 属性值

obj.name = '小王'  //将obj里面的name属性值修改为'小王'了。

4、查找对象的属性与属性值 : for in 方法

for (let key in obj) {
  console.log(key)   //输出的是对象的key值即属性
  console.log(obj[key])   //输出的是对象的value值即属性值
}

注意

• 增加属性和修改属性的方式是一样的，如果对象中有该属性，那么就是修改，反之则是增加

包装类

• 用户定义的字面量，会包装成对象

• 所有的包装类对象参与运算，在参与运算时，会被自动拆箱成原始类型

• 因为js是弱类型语音，所以只有在赋值语句执行时才会判断值的类型， 当值被判定为原始类型时，就会自动将包装对象上的属性移除

var num = 123  //   V8会执行为:  var num = new Number(123)这样
num.a = 'aaa'
// V8下一步会将num.a去除掉（delate num.a），因为num是一个原始类型，不能有属性。
// 这是为什么打印num.a不报错的原因
console.log(num.a); //undefined

易错点

var A = 'hello'
console.log(A.length);  //5  这里的length是属于继承了父类的方法

var arr = [1,2,3,4,5]
arr.length = 2
console.log(arr);  //[1,2]

var str = 'abcd'
str.length = 2  //因为是原始数据类型，其没有这个方法，
                // 是继承父类的的方法，这样就看成添加属性，不能添加属性
console.log(str);  //'abcd'

判断数据类型

1.typeof 可以准确的除了null以外的所有原始类型(null会被判断为Object)

console.log(typeof 42); // "number" 
console.log(typeof "hello"); // "string" 
console.log(typeof true); // "boolean" 
console.log(typeof undefined); // "undefined" 
console.log(typeof null); // "object" (历史遗留问题)
console.log(typeof function(){}); // "function"
console.log(typeof {}); // "object" 
console.log(typeof []); // "object" 
console.log(typeof new Date()); // "object"

typeof不适用于引用数据类型

原因

为什么 typeof 对引用类型不准确

1. ​​历史原因​​：

   • JavaScript 早期设计时，null 被错误地标记为 object（这个 bug 无法修复，因为会破坏现有代码）
   • 所有引用类型（除函数外）都被归为 "object"

2. ​​技术实现​​：

   • JavaScript 引擎内部使用类型标签（type tags）系统
   • 对象类型（包括数组、日期等）共享相同的类型标签 0

3. ​​语言设计哲学​​：

   • JavaScript 是动态类型语言，强调"鸭子类型"而非严格的类型检查
   • 区分具体引用类型不是 typeof 的设计目的