JavaScript知識概況
1、JavaScript介紹
JavaScript是一種輕量級的指令碼語言，和python語言是一樣的，只是由瀏覽器解釋執行，JavaScript可以插入HTML中，由瀏覽器執行。
目前有兩種方式寫入JavaScript：
直接嵌入<script></script>
寫入到外部的js檔案中，更容易維護。
由於HTML程式碼是從上到下執行，如果Head中的js程式碼耗時嚴重，就會導致使用者長時間無法看到頁面，如果放置在body程式碼塊底部，那麼即使js程式碼耗時嚴重，也不會影響使用者看到頁面效果，只是js實現特效慢而已。因此建議js程式碼放在body內部的最下面。
案例：script的兩種實現方法
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--js檔案匯入-->
<script src="common.js"></script>
<!--直接嵌入-->
<script>
alert(123);
</script>
</body>
</html>
2、兩種條件語句：
if語句：
switch語句：
3、三種迴圈語句
i++迴圈索引
in語句，迴圈索引，可以處理字典的迴圈
while語句
4、函式：
普通函式：
匿名函式，沒有名字的函式
自執行函式：直接把匿名函式和執行功能放在一起了。
5、作用域：大括號、函式是一個作用域
塊級作用域：if{}就為一個塊級作用域。JavaScript無塊級作用域，因此才能在{}外輸出name值；新版本上使用let代替var時，會有塊級作用域。
JavaScript採用函式作用域，每個函式作為一個作用域，在函式外部無法訪問內部作用域中的變數。
由於JavaScript中的每個函式作為一個作用域，如果出現函式巢狀函式，則就會出現作用域鏈。當出現作用域鏈時，子物件會一級一級地向上尋找所有父物件的變數。所以，父物件的所有變數，對子物件都是可見的，反之則不成立。
案例1：當執行console.log(xo)時，其尋找順序為根據作用域鏈從內到外的優先順序尋找，如果內層沒有就逐步向上找，直到沒找到丟擲異常。
JavaScript的作用域在被執行之前已經建立，日後再去執行時只需要按照作用域鏈去尋找即可。
案例1：作用域鏈在被執行之前已經建立：全域性作用域 -> Func函式作用域 -> inner函式作用域。執行順序見圖：
案例2：作用域鏈在被執行之前已經建立：全域性作用域 -> Func函式作用域 -> inner函式作用域。xo被重新賦值：
案例3：雙作用域鏈：建立兩條作用域鏈：1）全域性作用域 ->Bar函式作用域 ；2）全域性作用域-> func函式作用域。xo去bar的作用鏈找值
6、閉包
由於在Javascript語言中，因為作用域的關係，只有函式內部的子函式才能讀取區域性變數，在函式外部自然無法讀取函式內的區域性變數。出於種種原因，我們有時候需要得到函式內的區域性變數。這個時候就用到了閉包。
案例1：函式f2就被包括在函式f1內部，這時f1內部的所有區域性變數，對f2都是可見的。
但是反過來就不行，f2內部的區域性變數，對f1就是不可見的。
案例2：既然f2可以讀取f1中的區域性變數，那麼只要把f2作為返回值，就可以在f1外部讀取它的內部變量了。 f2函式，就是閉包。
可以把閉包簡單理解成"定義在一個函式內部的函式"。在本質上，閉包就是將函式內部和函式外部連線起來的一座橋樑。
閉包可以用在許多地方。它的最大用處有兩個，一個是前面提到的可以讀取函式內部的變數，另一個就是讓這些變數的值始終保持在記憶體中。
案例3：閉包應用，
閉包f2函式一共運行了兩次，第一次的值是999，第二次的值是1000。這證明了，函式f1中的區域性變數n一直儲存在記憶體中，並沒有在f1呼叫後被自動清除。
原因就在於f1是f2的父函式，而f2被賦給了一個全域性變數，這導致f2始終在記憶體中，而f2的存在依賴於f1，因此f1也始終在記憶體中，不會在呼叫結束後，被垃圾回收機制（garbage collection）回收。
這段程式碼中另一個值得注意的地方，就是"nAdd=function(){n+=1}"這一行，首先在nAdd前面沒有使用var關鍵字，因此nAdd是一個全域性變數，而不是區域性變數。其次，nAdd的值是一個匿名函式（anonymous function），而這個匿名函式本身也是一個閉包，所以nAdd相當於是一個setter，可以在函式外部對函式內部的區域性變數進行操作。
閉包知識參考網址：http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html
7、面向物件
Javascript是一種基於物件（object-based）的語言，但語法中沒有class（類）。為了解決從原型物件生成例項的問題，Javascript提供了一個建構函式（Constructor）模式。
案例1：建構函式，建立物件
Foo充當的建構函式
this代指物件
建立物件時需要使用 new
上述程式碼中每個物件中均儲存了一個相同的Func函式，比如不需要賦新值，相同的方法和屬性，就會浪費記憶體。使用原型可以把相同的方法和屬性放進去，解決該問題。
Javascript規定，每一個建構函式都有一個prototype屬性，指向另一個物件。這個物件的所有屬性和方法，都會被建構函式的例項繼承。
案例2：相同的function函式放進原型中
面向物件參考文章：
http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_encapsulation.html
8、變數介紹：
2-1 全域性變數及區域性變數的區別：就在於是否有var關鍵字：
var x=2； 為區域性變數，帶var關鍵字
x=3；為全域性變數，不帶var
建議：寫變數的時候，為了避免出錯，只要定義變數就先加上var，最後考慮全域性變數的再去掉var關鍵字。
2-2 資料型別：
原始型別：數字、字元、布林
物件型別：陣列、字典
1）數字（Number）
JavaScript中不區分整數值和浮點數值，所有的數字均用浮點值表示。
把其他值轉為數值的方式
關於其他值的轉換：
parseInt(..) 將某值轉換成數字，不成功則NaN
parseFloat(..) 將某值轉換成浮點數，不成功則NaN
特殊值：
NaN，非數字。可使用 isNaN(num) 來判斷。
Infinity，無窮大。可使用 isFinite(num) 來判斷。
常量：比如Math.E常量e、Math.PI 常量等
靜態函式：Math.abs( ) 計算絕對值、 Math.acos( ) 計算反餘弦值、 Math.max( ) 返回兩個數中較大的一個、math.random( ) 計算一個隨機數、Math.round( ) 舍入為最接近的整數、 Math.sqrt( ) 計算平方根等。
2）字串（String）
字串是由字元組成的陣列，但在JavaScript中字串是不可變的：可以訪問字串任意位置的文字，但是JavaScript並未提供修改已知字串內容的方法。
主要方法有：
obj.length：長度
obj.trim()：移除空白，obj.trimLeft()、obj.trimRight)
obj.charAt(n)：返回字串中的第n個字元
obj.concat(value, ...)： 拼接
obj.indexOf(substring,start)： 子序列位置
obj.lastIndexOf(substring,start)：子序列位置
obj.substring(from, to)：根據索引獲取子序列
obj.slice(start, end)：切片
obj.toLowerCase()：大寫
obj.toUpperCase()：小寫
obj.split(delimiter, limit)：分割
obj.search(regexp)：從頭開始匹配，返回匹配成功的第一個位置(g無效)
obj.match(regexp)：全域性搜尋，如果正則中有g表示找到全部，否則只找到第一個。
obj.replace(regexp, replacement)：替換，正則中有g則替換所有，否則只替換第一個匹配項：
$數字：匹配的第n個組內容；
$&：當前匹配的內容；
$`：位於匹配子串左側的文字；
$'：位於匹配子串右側的文字
$$：直接量$符號
案例：跑馬燈案例：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="i1" style="display:inline-block;background-color:green;color:white">歡迎光臨</div>
<script>
//定時器，1秒鐘執行一次
setInterval("f1()",10)
//定義函式，迴圈取值
function f1(){
// js 獲取某一標籤
var tag=document.getElementById('i1');
//獲取標籤內容
var text =tag.innerText;
alert(text);
var a=text.charAt(0);
var sub=text.substring(1,text.length);
var new_str=sub +a ;//新字串
tag.innerText=new_str;//返回div標籤
}
</script>
</body>
</html>
效果：
迴圈執行，一秒鐘出現一次框
3）布林型別（Boolean）
布林型別僅包含真假，與Python不同的是其首字母小寫。
== 比較值相等
!= 不等於
=== 比較值和型別相等
!=== 不等於
|| 或
&& 且
4）陣列
JavaScript中的陣列類似於Python中的列表
常見功能：
obj.length 陣列的大小
obj.push(ele) 尾部追加元素
obj.pop() 尾部獲取一個元素
obj.unshift(ele) 頭部插入元素
obj.shift() 頭部移除元素
obj.splice(start, deleteCount, value, ...) 插入、刪除或替換陣列的元素；
obj.splice(n,0,val) 指定位置插入元素；
obj.splice(n,1,val) 指定位置替換元素；
obj.splice(n,1) 指定位置刪除元素
obj.slice( ) 切片
obj.reverse( ) 反轉
obj.join(sep) 將陣列元素連線起來以構建一個字串
obj.concat(val,..) 連線陣列
obj.sort( ) 對陣列元素進行排序
5）其他功能：
序列化
JSON.stringify(obj) 序列化
JSON.parse(str) 反序列化
轉義
decodeURI( ) URl中未轉義的字元
decodeURIComponent( ) URI元件中的未轉義字元
encodeURI( ) URI中的轉義字元
encodeURIComponent( ) 轉義URI元件中的字元
escape( ) 對字串轉義
unescape( ) 給轉義字串解碼
URIError 由URl的編碼和解碼方法丟擲
文章參考：http://www.cnblogs.com/wupeiqi/articles/5602773.html
學習來源：老男孩視訊