万物皆对象，你信吗？

news2024/11/18 10:31:38

**内存空间和数据都消失，数据怎么会消失的？**空间没了，数据自然也跟着消失。因为数据就是在空间里面的。就像宇宙大爆炸，我们还能存在嘛，是不是已经undefined了。「一块小内存上有2种数据类型」

内部存储的数据
地址值

触碰到你的知识盲区？问题不大，来张图。现在从栈中，新建个var a = obj，那么我是将obj的内存赋给a吗？不是的，是将obj的地址值拷贝给a。那么对应上面的

内部存储的数据 – 对应的是obj
地址值 – obj对应的0X123

「内存分为两种」

栈: 全局变量/局部变量
堆: 对象

function fn(){

// obj是局部变量，同时也是栈

// { name } 该对象是堆空间

var obj = { name: ‘吖泽’ }

}

函数是在堆，函数名是在栈中。

巴啦啦变变变，什么是变量?

顾名思义，可变化的量, 由变量名和变量值组成。每个变量都对应的一块小内存, 变量名用来查找对应的内存, 变量值就是内存中保存的数据。

数据、内存、变量三角恋关系？

内存用来存储数据的空间。变量是内存的标识。

相信看到这里对数据、内存、变量三者概念有了一定的了解了。

面试官：出道题给你热下身哈 ~

var obj1 = { name: ‘阿泽’ }

var obj2 = obj1

请问：obj2保存的是什么，obj1的地址值吗？

NO ~ NO ~ NO ~

obj2保存的是obj1的内存内容，只不过这个内存内容恰巧是地址值；

但不能直接说：保存的是就是地址值。

面试官：以下程序输出什么？99%的人都做错，不信你可以捂住答案 ^_

var a = {age: 12}

var b = a

a = {name: ‘BOB’, age: 13}

b.age = 14

console.log(b.age, a.name, a.age)

function fn2 (obj) {

obj = {age: 15}

}

fn2(a)

console.log(a.age)

想好了答案，往浏览器输出一下，答案自然浮出水面（看看和自己的答案对上了没^_）

关于引用变量赋值问题

了解上面的程序所挖掘的考点，其实是引用变量赋值的问题。有两小点，其一：**「（n）2个引用变量指向同一个对象, 通过一个变量修改对象内部数据, 另一个变量看到的是修改之后的数据」**让我们通过程序翻译一下以上文字。

var obj1 = {name: ‘Tom’}

var obj2 = obj1

obj2.age = 12

console.log(obj1.age) // 12

function fn (obj) {

obj.name = ‘A’

}

fn(obj1)

console.log(obj2.name) //A

// obj1、obj2两个或两个以上的引用变量指向同一个对象({name: ‘Tom’})；

// 通过obj2.age = 12修改对象数据，那obj1自然也看到的是修改之后的数据。

其二：**「（n）2个引用变量指向同一个对象, 让其中一个引用变量指向另一个对象, 另一引用变量依然指向前一个对象」**同样，我们通过程序翻译一下以上文字。（其实就是上头那道编程输出题）

var a = {age: 12}

var b = a

a = {name: ‘BOB’, age: 13}

b.age = 14

console.log(b.age, a.name, a.age) // 14 Bob 13

// a、b这2个引用变量指向同一个对象（{age: 12}），

// 让a重新赋值{name: ‘BOB’, age: 13}，此时b指向的仍然是最初的{age: 12}

// 现在a、b指向的就是两个对象了，因为a重新赋值啦。

function fn2 (obj) {

obj = {age: 15}

}

fn2(a)

console.log(a.age) // 13

// 应该最后一个输出，很多人的答案是15吧，为什么不是15呢？

// 因为这是在fn2函数作用域内重新赋值，此次赋值是局部中，

// 一旦fn2()函数执行完，函数本身会被释放，那{ age: 15 }就灰飞烟灭

// 所以最终执行完，打印a.age还是13。

函数执行完成，函数内的局部变量就会被释放。

**「思考：fn2()和上方其一讲的例子的fn()区别」**这和上方的fn()可不一样，fn()里是obj.name可不一样，人家那是点链操作，还是改的是同一个对象。fn()是修改属性，作用在全局环境中；而fn2()是改引用对象的值，作用在局部环境中。还是懵懵懂懂嘛，上张图助你更加清晰 ~ 仔细看，你会真的懂的啦！