第1题-值和引用

面试题目：

function fn() {
    var n = 9;
    function add(){
        console.log(n++);
    }
    return {
        n: n,
        add: add
    }
}

var t1 = fn();
var t2 = fn();

t1.add();
console.log(t1.n);

t2.add();
console.log(t2.n);

输出结果

9, 9, 9, 9

---

解析：

上面的题目是腾讯的面试题，主要考察值和引用方面的知识点。涉及知识点如下：

1. 值的类型

Javascript 中的值分为两种类型：基本类型和引用类型。每种类型下面又包含5种类型。

• 基本类型，包含 Number、String、Boolean、Undefined、Null。
• 引用类型，包含函数、数组、日期、正则、错误。

注意：所有的引用类型都是对象，也就是Object对象下的一个类。

2. 值和引用

将一个值赋给变量时，解析器必须确定这个值是基本类型值还是引用类型值。

1. 对基本类型，是按值访问的，即通过值复制的方式来赋值和传递。
2. 对引用类型，是按引用访问的，即通过引用复制的方式赋值和传递。在操作对象时，实际上是在操作对象的引用，而不是实际的对象。

综上可知：

1. 执行 t1 = fn() 时，返回的是一个object对象，对象的属性n属于基本数据类型，所以直接复制一个副本9赋值给n；add是函数，属于引用类型，赋值的是函数的引用地址。
2. 执行 t1.add() 时，由于闭包的作用，输出的是变量n的值9，并且变量n自增变为10。
3. 执行 console.log(t1.n) 时，t1.n 与 闭包中的变量n已没有关联，n的变化，不会影响到t1.n的值，所以输出仍然是9。
4. 同理，t2输出的也是9。

---

延伸

如果将题目改为如下：

function fn() {
    var obj = {
        n: 9
    };
    function add(){
        console.log(obj.n++);
    }
    return {
        obj: obj,
        add: add
    }
}

var t1 = fn();
var t2 = fn();

t1.add();
console.log(t1.obj.n);

t2.add();
console.log(t2.obj.n);

输出结果

9, 10, 9, 10

---

扫一扫 下方二维码，关注我的公众号【前端名狮】，更多精彩内容陪伴你！

前端名狮