說點別的
這是《關于 JavaScript 你必須要知道的 33 個概念 》系列的第三篇文章专肪，今天稍微給大家介紹下這個系列坝冕。
如今前端的發(fā)展日新月異而姐，很多人(包括我)都是追逐著一些流行的框架學習炊邦，但往往是浮于表面孩擂，知其然而不知其所以然狼渊。當我認真的想要搞懂 react、redux 實現原理時类垦，才發(fā)現狈邑，JavaScript 的基礎知識是如此重要。
一直以來蚤认，自己對于 JavaScript 的理解都散亂無章米苹，這就造成很多知識當時看過后感覺明白了，過一段時間用到的時候卻仍舊一臉懵逼烙懦。因此驱入，我決定整理這樣一個系列赤炒，加深自己對 JavaScript 的理解，形成知識體系亏较，以達到融會貫通莺褒。
這個計劃會寫 33 篇文章，會包括 JavaScript 中的基礎概念如「數據類型」雪情、「表達式和語句」遵岩、「作用域」等，以及如「閉包」巡通、「this」尘执、「promise」等有些理解難度的知識點。
首先聲明我不是什么大佬宴凉，對于很多知識也是一邊鉆研一邊寫誊锭，所以如果有不同的看法，懇請大家指正弥锄，我會及時更新文章的不足之處丧靡！
接下來，我們言歸正傳籽暇。
定義和分類
在上一篇文章（數據類型）中我們知道 JavaScript 的數據類型分為基本數據類型和對象數據類型温治。它們的區(qū)別之一就是在計算機中的存儲方式不同：基本類型數據是將變量名及值存儲在變量對象中，而引用類型的數據是將變量名和地址存儲在變量對象中戒悠，真正的值是存儲在堆內存中熬荆。
再次將那張圖放過來：
其中，基本類型（number,string,boolean,undefined,null）,便稱為值類型绸狐，而對象類型（object,function,array及封裝對象）便稱為引用類型卤恳。
值類型與引用類型的區(qū)別
1. 可變性與不可變性
值類型的數據是不可變的。 這里說的不可改變六孵，是指值本身纬黎，一旦創(chuàng)建，便不可更改劫窒。什么意思？舉個例子：
let a = 34;
a = 43;
我們先聲明一個變量 a 并賦值為 34拆座，此時主巍，在變量對象中 34 就已經存放在固定位置，后邊將 a 的值改為 43挪凑，看起來好像是將 34 改變成了 43孕索， 其實不然，我們只是又在變量對象中存入了 43躏碳，原來的 34搞旭，仍舊原封未動的存在那里，等待著被內存回收。如下圖所示：
引用類型值是可以改變的肄渗。 引用類型的值是將變量名稱和引用地址存儲在變量對象中镇眷，而值是在堆內存中，我們可以隨時更改它本身的值翎嫡。
let b = {
m: 1,
n: 'emmm'
}
b.m = 4;
b; // {m: 4,n: 'emmm'}
在上例中欠动，我們聲明 b 是一個引用類型值，接著惑申，我們對 b 進行了更改具伍，我們可以看到，更改是有效的圈驼。
2. 值的復制
值類型的復制是值本身的復制人芽，引用類型的復制是值得引用的復制。 不同的復制方式會在復制后有不同的表現绩脆。
// 值類型的復制
var a = 45;
var b = a;
console.log(b); // 45
b = "someword";
console.log(b) // "someword"
console.log(a); // 45
// 引用類型的復制
var someone= {
age: 14,
weight: 134,
sex: 'man'
};
var anthor = someone;
console.log(anthor); // {age: 14, weight: 134, sex: "man"}
anthor.age = 16;
console.log(anthor); // {age: 16, weight: 134, sex: "man"}
console.log(someone); // {age: 16, weight: 134, sex: "man"}
從上面的代碼中可以看到啼肩，變量 b 復制變量 a 的之后進行了更改，b 的值改變了衙伶，而 a 的值沒變祈坠；變量 anthor 復制的是 someone 的引用，anthor 更改了引用指向的那個對象的值矢劲，someone 的值自然也跟著改變了赦拘。
具體過程如圖所示：
應用
它們的概念理解起來很簡單，但很多時候應用到實際場景中芬沉，我們就可能想不到這一層躺同，會造成很多意外的問題，接下來我們看一下丸逸。
1. == 與 ===
在進行 == 及 === 判斷時蹋艺，前者會對等號兩邊的值進行強制類型轉換，這對判斷值類型的相等有所區(qū)別黄刚。但是對于引用類型捎谨，它們都只會判斷引用地址是否相同，而不管對象里的屬性值是否相同憔维。
比如：
// 值類型相等
let a = 45;
let b = 45;
console.log(a == b); // true
b = '45';
console.log(a == b); // true
console.log(a === b); // false
// 引用類型相等
let men_1 = {
age: 23,
sex: 'man',
};
let men_2 = {
age: 23,
sex: 'man',
};
let men_3 = men_1;
console.log(men_1 == men_2); // false
console.log(men_1 === men_2); // false
console.log(men_1 == men_3); // true
console.log(men_1 === men_3); // true
從上面我們可以看到：45 === 45 但 45 != '45'涛救，但 men_1 雖然和 men_2 的值相同，但他們并不相等业扒，無論是 == 還是 ===检吆。
那該如何按照我們的想法比較呢？
可以把它們轉化為字符串進行比較程储，當然蹭沛，這樣也不能保證完全正確（比如對象中含有正則表達式）臂寝，更嚴格的方法以后再討論。
function compare(a, b) {
return JSON.stringify(a) == JSON.stringify(b);
}
2. 函數傳參
函數傳參時摊灭，是將傳入的參數拷貝到函數的參數參數變量上咆贬，因此，拷貝帶來的問題在函數傳參時仍舊存在斟或。
function foo(a,b) {
var d = a;
d = 'string';
var e = b;
e.name = 'xiaohong';
}
var exmp_1 = 3;
var exmp_2 = {
name: 'xiaohua'
};
foo(exmp_1,exmp_2);
console.log(exmp_1); // 3
console.log(exmp_2); // {name: "xiaohong"}
如上所示素征，值類型傳入后再函數內的修改不會污染外部的變量，而引用類型的變量由于復制的是引用萝挤，在函數內部的改動會影響到外部的變量御毅。
若是想要避免這種情況，則需要在接受參數時進行深拷貝怜珍。
function foo(people) {
const newPeople = JSON.parse(JSON.stringify(people));
newPeople.firstName = 'wang';
}
var Liu = {
firstName: 'liu'
}
foo(Liu);
console.log(Liu); // {firstName: "liu"}
一道小題
到此端蛆，關于值類型與引用類型的介紹就結束了，留一道題給大家酥泛，大家可以借此看一看對本文的理解今豆。
function create(person) {
var personA = person;
personA.name = 'David';
var personB = {
name: 'saay',
age: 13
};
return personB;
}
var Jone = {
name: 'Join',
age: 25
}
var Wang = create(Jone);
console.log(Jone) ;// ??
console.log(Wang); // ??
