你是一名合格的前端工程師嗎？
之前看過一篇文章叫你一聲前端工程師，你敢應(yīng)么？淺談前端工程師該如何定位！，覺得寫的很好，里面提到
“到底所謂的前端都應(yīng)該干些什么、會(huì)寫什么呢? 本人身邊有太多的人會(huì)切幾張圖, 會(huì)用jQuery做個(gè)特效, 會(huì)從bootstrap里復(fù)制粘貼,會(huì)用html游戲框架寫個(gè)flappy bird, 會(huì)在Github里找各種模板自和庫拼拼湊湊, 就口口聲聲大言不慚的稱自己為前端工程師.”
文章中所說的這類前端工程師，著實(shí)不在少數(shù)，在公司面試前來應(yīng)聘前端崗位的童鞋的時(shí)候發(fā)現(xiàn)，一些工作多年的前端連最基礎(chǔ)的js數(shù)據(jù)類型都不清楚。為什么很多前端都處在這樣一個(gè)層次水平上？其實(shí)想想和前端的工作內(nèi)容，工作性質(zhì)不無關(guān)系。
前端工作，圍繞的主要語言無非3種，html、css、js：
其中html和css更加類似于其它語言中的UI庫，html－超文本標(biāo)記語言，負(fù)責(zé)搭建頁面Dom結(jié)構(gòu)，css-層疊樣式表，負(fù)責(zé)頁面樣式展示，這兩種語言對于小白用戶都無比親切，不需要具備基礎(chǔ)編程思想，看個(gè)幾小時(shí)，就可以自己寫出靜態(tài)頁，頁面加個(gè)背景，改個(gè)顏色，拼拼湊湊，怎么都能寫出來。其實(shí)，這也是從事前端工作的一個(gè)優(yōu)勢，即：入門容易，最初學(xué)習(xí)難度不大，容易培養(yǎng)起web開發(fā)的興趣。
負(fù)責(zé)頁面行為的可以稱之為編程語言的javascript(雖然到現(xiàn)在還有很多不明是非的人認(rèn)為js就是個(gè)腳本語言，就是給頁面加點(diǎn)特效，我只能說：“大哥，不懂的話，你還是別說了，啪啪打臉”)，學(xué)習(xí)曲線和其它高級程序語言不同，它的學(xué)習(xí)曲線是由緩到陡,簡單來說，就是比較好入門，學(xué)個(gè)一天，就可以給頁面加一些簡單的動(dòng)效，增加一些點(diǎn)擊交互什么的。但是在大型工程中，該如何組織代碼，如果進(jìn)行封裝，如果將js這種看似松散，異常靈活的語言好好組織，是需要一番功夫的。此外，js還有一些你認(rèn)為是A的地方，其實(shí)是B，細(xì)節(jié)的小坑無數(shù)，如果不掌握好基礎(chǔ)，怎么可能走的更遠(yuǎn)，想要進(jìn)階，基礎(chǔ)必須打牢，萬丈高樓平地起，打鐵還需自身硬 。
好了，廢話了那么多，讓我們從基礎(chǔ)開始，回到圖解js犀牛書系列文章，繼續(xù)前行。
寫在前面
之前的文章Introduction to Javascript介紹了，js是一種非類型定義的動(dòng)態(tài)的語言，變量類型無需提前指定，那么js里面有多少種數(shù)據(jù)類型呢？簡單說來，可以分為兩大陣營：基本數(shù)據(jù)類型（primitive type）+ 對象數(shù)據(jù)類型（object type）：
基本數(shù)據(jù)類型：number、string、boolean、null、undefined
對象數(shù)據(jù)類型：任何js value,只要不是primitive type ,就是object type，如：Function、Array、Date、RegExp、Error
數(shù)據(jù)類型這么多，先不說他們有何區(qū)別 ，先舉幾個(gè)簡單的栗子：
null == undefined
"1" == true
NaN !== NaN
0 === -0
Infinity === -Infinity
這幾個(gè)表達(dá)式哪些是true，哪些是false，你都知道嗎？（答案，只有最后一個(gè)是false）
var a = {x :1};
var b = a;
b.x = 2;
a === b; //true or false
var a1 = 2;
var b1 = 2;
a1 === b1; //true or false
var a2 = {x: 1};
var b2 = {x: 1};
a2 === b2; //true or false
答案：true、true、false
var a = 1/0;
var a = -1/0;
var a = 0/0;
var a = Infinity/Infinity;
var a = 1/Infinity;
var a = -1/Infinity;
var a = Infinity/0;
答案： Infinity, -Infinity, NaN, NaN, 0, -0, Infinity
都答對了嗎？
以上只是幾個(gè)特別基礎(chǔ)的點(diǎn)，但是在面試中，不少人竟然都答錯(cuò)了。。。。因此，沉下心來認(rèn)真讀書真的很重要。外行看熱鬧，內(nèi)行看門道，真想成為一名前端工程師，就別天天沉迷在炫酷的頁面特效上了（隨便去國外網(wǎng)站上copy一下代碼，覺得自己超厲害），而要打好基礎(chǔ)，從軟件工程的視角出發(fā)，先成為一名工程師。
js數(shù)據(jù)王國
js數(shù)據(jù)類型多樣，每個(gè)細(xì)節(jié)瑣碎，易忽略，不好記憶，針對這類知識點(diǎn)，我們采用圖表法＋比喻法來幫助理解記憶。
前面提到j(luò)s分為兩大數(shù)據(jù)類型，基本數(shù)據(jù)類型primitive type和對象數(shù)據(jù)類型object type，如下圖所示：
基本數(shù)據(jù)類型屬于值類型，對象數(shù)據(jù)類型屬于引用類型。
基本數(shù)據(jù)類型－Number
基本數(shù)據(jù)類型－String
javascript使用“String”類型來表示Text。
String基本數(shù)據(jù)類型的特點(diǎn)：
-
不可以修改，immutable。舉個(gè)栗子：
eg: var a = "hello";a.toUpperCase(); //return "HELLO"console.log(a); //a is still "hello"拓展：
這里可以引申一下，基本數(shù)據(jù)類型不可以添加屬性，但是我們發(fā)現(xiàn)他們有很多的方法，比如上個(gè)例子中提到的toUpperCase,看起來很像是對象。并且這樣寫，也不會(huì)報(bào)錯(cuò)：
var a = "hello";` a.len = 4; a.len // undefined為什么會(huì)有這樣的行為？這里有個(gè)概念，叫做“包裝對象 wrap objects”,后續(xù)文章會(huì)進(jìn)行補(bǔ)充。
16bit
有序序列 ordered sequence
-
在ES5標(biāo)準(zhǔn)里，string可以視為只讀數(shù)組。下標(biāo)從0開始。
拓展：
既然字符串被視為數(shù)組，那么我們可以采用數(shù)組的方式讀取字符串中的某一個(gè)位置的字母，eg:
var a = "hello;" console.log(a[1]); //"e"
基本數(shù)據(jù)類型－Boolean 布爾
boolean類型只包括兩個(gè)值： true、false；
在js程序中，當(dāng)在條件判斷中，如：if/else，變量會(huì)被隱式轉(zhuǎn)換為boolean;
js中，所有類型的變量都可以轉(zhuǎn)換為boolean;
轉(zhuǎn)換成boolean為false的值有：0, -0, "", undefined, null, NaN；
剩下其它所有數(shù)據(jù)類型，轉(zhuǎn)換為boolean時(shí)，均為true。注意：所有的object都會(huì)轉(zhuǎn)成true,甚至是空數(shù)組[];
-
同樣不可以修改，immutable。舉個(gè)栗子：
eg: var b = true;b.toString(); //return "true"console.log(b); //b is still true注:boolean包裝對象只有這一個(gè)方法：toString();
基本數(shù)據(jù)類型－null and undefined
null(表示無的對象)
- 意思是沒有值，represent no value for a variable；表示沒有對象；
- null是null這個(gè)數(shù)據(jù)類型里唯一的值；
- typeof null // "object"
- null是js里的一個(gè)關(guān)鍵詞，keyword；
- Number(null) // 0
- 1 + null //1
undefined(表示無的原始值)
- undefined表示"缺少值",表示這里應(yīng)該有一個(gè)值，但是還沒有定義；
- undefined是undefined這個(gè)數(shù)據(jù)類型里唯一的值；
- typeof undefined //"undefined"
- undefined是一個(gè)全局變量
- Number(undefined) //NaN
- 1 + undefined //NaN
null 和 undefined轉(zhuǎn)換為boolean時(shí)，都為false；
null == undefined //true
拓展
null 和 undefined的使用場景：
null表示"沒有對象"，即該處不應(yīng)該有值。典型用法是：
- 變量回收，將一個(gè)變量賦值為null.var a = null;
- 作為對象原型鏈的終點(diǎn)，Object.getPrototypeOf(Object.prototype) //null
- call, apply時(shí)，只是想借用一個(gè)函數(shù)功能，因此將上下文環(huán)境context設(shè)置為null,eg:Math.max.apply(null,[1,2,4]) //4
- ....
null表示"暫未賦值”，典型的用法是：
-
在js變量提升特性中，變量的定義會(huì)被提升至函數(shù)頂部，此時(shí)變量的值為undefined,eg:
function foo() { console.log(a); // undefined var a = 1;` console.log(a); //1 } 變量被聲明了，但沒有賦值時(shí)，就等于undefined;
調(diào)用函數(shù)時(shí)，應(yīng)該提供的參數(shù)沒有提供，該參數(shù)等于undefined;
對象沒有賦值的屬性，該屬性的值為undefined;
函數(shù)沒有返回值時(shí)，默認(rèn)返回undefined;
