作為一個前端新人，看了很多關于前端的博客，覺得有必要去記錄點知識點和自己的總結，所以在工作之余寫了這篇文章，該博客有引用到其他文章的內容，純屬學習，在此膜拜一下各位前端大大。

一.聲明定義

var es6之前的方法 用于定義變量

let es6的新語法 用于定義跨級作用域本地變量

const es6的新語法 用于定義常規變量(定義的變量不會被重新定義)

申明了變量沒有賦值打印出來是undefinded,沒有申明變量打印出來為NULL
5.未賦值的變量做計算，它的值為NAN

二.作用域

es6支持塊級作用域，需要用es6的let屬性來聲明變量 例如if、setTimeout等等

if(true){var a = 1; } console.log(a); // 輸出為1

當使用let時

if(true){let a = 1; } console.log(a); // a is not defined(…)

變量上浮：
javascript會自動將變量的聲明上浮到函數或者全局的最前面，所以再代碼執行前，變量的賦值就已經為undefined

console.log(a);//undefinded var a = 3;//例如 var b = 5; function work(){console.log(b);//undefindedvar b = 4; } work();

三.數據類型

6種基礎類型
1.Bollean(布爾值)
2.string(字符串)
3.undefined
4.null
5.Number
6.symbol(ES6新增)：
symbol是程序創建并且可以用作屬性鍵的值，并且它能避免命名沖突的風險。symbol與其它類型并不完全相像，symbol被創建后就不可變更，你不能為它設置屬性（在嚴格模式下嘗試設置屬性會得到TypeError的錯誤）。他們可以用作屬性名稱，這些性質與字符串類似。另一方面，每一個symbol都獨一無二，不與其它symbol等同，即使二者有相同的描述也不相等；你可以輕松地創建一個新的symbol。這些性質與對象類似。

一種對象類型:Object
對象和函數的區別在于前者是值的容器，后者是應用程序的過程

四.控制流和錯誤處理

1.塊表達式
塊表達式用于控制流，例如if、while、for
ES6之后有塊域范圍：在ES6中，我們可以把塊域聲明var改成let，讓變量只作用域block范圍。
2.邏輯判斷
判斷為false的特殊值：false、undefined、null、0、NaN、”"。
簡單boolean和對象Boolean類型有倆種區別 前者是Javascript的一種原始類型，它只有倆種值，true和false
使用Boolean(value)方法可以強制轉換任意值為boolean類型

1. alert(Boolean('')); //outpt false 2. alert(Boolean('hello')); //output true 3. alert(Boolean(100)); //output true 4. alert(Boolean(0)); //output false 5. alert(Boolean(NaN)); //output false 6. alert(Boolean(null)); //output false 7. alert(Boolean(undefined)); //output false 8. alert(Boolean(new Object())); //output true

五.內存空間

1.堆和棧
JavaScript沒有嚴格的去區分棧內存和堆內存，一般它的所有數據都存取在堆內存里。
堆內存的存取方式可以比喻成書架放書，書柜里的書沒有什么先后拿去順序，可以哪區任何位置的書籍和放回到任何位置，好比在JSON格式的數據中，我們存儲的key-value是可以無序的，因為順序的不同并不影響我們的使用，我們只需要關心書的名字。
棧內存的存取方式就像一個兵乓球盒子，具有先進后出，后進先出的特點，存儲原理如圖。

2.變量對象
Javascript的執行上下文生成的時候，會創建一個叫做變量對象的特殊對象，Javascript的基礎數據會保存在該變量對象里
3.引用數據類型與堆內存
JS的引用數據類型例如數組Array，它們的值是不確定的，引用數據類型的值是保存在堆內存中的對象。Javascript不能直接訪問堆內存空間，因此我們不能直接操作堆內存空間中的變量。因此我們在操作對象的時候其實是在引用該堆內存的對象，變量對象里保存的只是來自堆內存空間對象的地址，該地址與實際的堆內存值相關聯。

var a1 = 0; // 變量對象var a2 = 'this is string'; // 變量對象var a3 = null; // 變量對象var b = { m: 20 }; // 變量b存在于變量對象中，{m: 20} 作為對象存在于堆內存中var c = [1, 2, 3]; // 變量c存在于變量對象中，[1, 2, 3] 作為對象存在于堆內存中

當我們要訪問堆內存的引用數據類型時，首先從變量對象中獲取該對象的地址指針，再通過地址指針來獲取堆內存的數據

// DEMO var m = { a: 10, b: 20 } var n = m; n.a = 15;// 這時m.a為15

六.執行上下文(Execution Context)

每次當控制器轉到可執行代碼的時候，就會進入一個執行上下文。執行上下文可以理解為當前代碼的執行環境，它會形成一個作用域。運行包括三種情況:
1.全局環境
2 函數環境
3 eval:
每次當控制器轉到可執行代碼的時候，就會進入一個執行上下文。執行上下文可以理解為當前代碼的執行環境，它會形成一個作用域。

var code1='"a" + 2'; //表達式 varcode2='{a:2}'; //語句 alert(eval(code1)); //->'a2' alert(eval(code2)); //->undefined alert(eval('(' + code2 + ')')); //->[object Object]

在一個javascript的程序執行時，會產生多個執行上下文，javascript會以堆棧的方式處理它們。
棧底為全局上下文，棧頂為當前上下文

var color = 'blue';function changeColor() {var anotherColor = 'red';function swapColors() {var tempColor = anotherColor;anotherColor = color;color = tempColor;}swapColors(); }changeColor();

上下文執行過程如圖

上下文部分特點
1單線程
2同步執行，只有棧頂的上下文處于執行中，其他上下文需要等待
3全局上下文只有唯一的一個，它在瀏覽器關閉時出棧
4函數的執行上下文的個數沒有限制
5每次某個函數被調用，就會有個新的執行上下文為其創建，即使是調用的自身函數，也是如此。
執行上下文-生命周期
1.創建階段
在這個階段中，執行上下文會分別創建變量對象，作用域鏈和this指向
2.代碼執行階段
創建完成，開始執行代碼，完成變量賦值，函數引用，以及其他代碼執行

總結

以上是生活随笔為你收集整理的前端学习笔记！的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。