說實話，再你熟悉了C C++ java python后再學js，總是會有無數錯覺，總覺得它的語法像什么，又不太像。作為動態語言又沒python那么簡潔，里面很多語法借鑒了c和java的那套，但是又不像c那么嚴格。js是弱類型語言，而且還是有一些動態語言的靈活性在里面。

題記

如果帶著之前學C++/java的思路去學js，總覺得十分別扭，特別是它的object和function，真是讓人摸不著頭腦。

所以說啊，js真是個磨人的小妖精。要征服這個小妖精還真不是一時半會能實現的，所以，還是慢慢來吧，把征服它的過程都記錄一下。

注意：本文是一個本人的總結記錄文，并不是一個js教程，請不要抱著《從入門到精通》的思路來看本文。如果你有一定的編程基礎，或者正在學習js，這個筆記可能對你有點用。(以下筆記是廖雪峰javascript教程，還有freecodecamp教程筆記)

對了，本文持續更新ing....

6-20更新：

ES6規范中引入了Map和Set

map

• 創建map

var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);
m.get('Michael'); // 95

• Map具有以下方法：(set get has delete)

var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);m.has('Adam'); // 是否存在key 'Adam':true
m.get('Adam'); // 67
m.delete('Adam'); // 刪除key 'Adam' 如果刪除失敗返回false
m.get('Adam'); // undefined

由于一個key只能對應一個value，所以，多次對一個key放入value，后面的值會把前面的值沖掉：

var m = new Map();
m.set('Adam', 67);
m.set('Adam', 88);
m.get('Adam'); // 88

set

Set和Map類似，也是一組key的集合，但不存儲value。由于key不能重復，所以，在Set中，沒有重復的key。
要創建一個Set，需要提供一個Array作為輸入，或者直接創建一個`空

var s1 = new Set(); // 空Set
var s2 = new Set([1, 2, 3]); // 含1, 2, 3重復元素在Set中自動被過濾：
var s = new Set([1, 2, 3, 3, '3']);
s; // Set {1, 2, 3, "3"}

注意數字3和字符串'3'是不同的元素。

• add(key)方法
  可以添加元素到Set中，可以重復添加，但不會有效果：

>>> s.add(4)
>>> s
{1, 2, 3, 4}
>>> s.add(4)
>>> s
{1, 2, 3, 4}

• delete(key)方法
  可以刪除元素：

var s = new Set([1, 2, 3]);
s; // Set {1, 2, 3}
s.delete(3);
s; // Set {1, 2}

5-26更新：

字符串轉正則eval()

有人可能發現了，js的正則表達式并不是字符串，但是實際使用中，我們經常需要字符串去構造正則表達式，這個時候就可以用eval()去轉化。eval()可以用來解析字符串
但是eval是一個很危險的操作，如果非必要，盡量少使用

var test = 'this is a test';
var exp = '/\w/ig';
test.match(eval(exp));

數組的splice函數

array.splice(start, deleteCount[, item1[, item2[, ...]]])

js提供了一個splice函數，用來刪除index位置處的deleteCount數目的元素，并且在index處加入item1,2,3……（可以不加入）
這個函數可以用來替換數組內的部分元素

var myFish = ['angel', 'clown', 'mandarin', 'surgeon'];
// removes 0 elements from index 2, and inserts 'drum'
var removed = myFish.splice(2, 0, 'drum');
// myFish is ['angel', 'clown', 'drum', 'mandarin', 'surgeon']
// removed is [], no elements removed

removed = myFish.splice(3, 1);
// myFish is ['angel', 'clown', 'drum', 'surgeon']
// removed is ['mandarin']

removed = myFish.splice(2, 1, 'trumpet');
// myFish is ['angel', 'clown', 'trumpet', 'surgeon']
// removed is ['drum']

數組的slice函數

arr.slice([begin[, end]])

取出數組的從begin到end的元素，重新組成數組。

var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
var citrus = fruits.slice(1, 3);// ['Orange','Lemon']

5-25更新：

字符串的slice()和substr()和substring()

str.slice(beginSlice[, endSlice])
str.substr(start[, length])

str.substring(indexStart[, indexEnd])

都是截斷函數，但是有一些區別

• slice和substr能接負數，代表倒數。substring不行
• substr第二參數代表長度不是end
• substring的end如果大于start會自動交換，slice不會,會返回""
• 三者均支持越界

var str = "example";
console.log(str.slice(-3)); // "ple" 
console.log(str.substr(-3)); // "ple" 
console.log(str.substr(2,4)); // "ampl" 
console.log(str.substring(2,4)); // "am" 
console.log(str.slice(4,2)); // "" 
console.log(str.substring(4,2)); // "am" 
console.log(str.slice(2,-1)); // "ampl" 
console.log(str.substring(0,100)); // "example" 
console.log(str.slice(0,100)); // "example" 
console.log(str.substr(0,100)); // "example" 

for in vs for of (ES6新加)

js中也有for in用法，但是和python有些不一樣的地方。

• js中的for in對數組也是返回的是鍵，比如“0”，“1”……(而且由于歷史遺留問題，'name'也在遍歷范圍內)
• python中直接返回的是數組中的值
• js中的for of和python中的for in才是真實對應的哦~不僅可以用于數組也可以用于字符串

所以for in用在json中的遍歷比較合適。
比如說你如果需要遍歷數組，你可以使用普通for循環做，也可以用for of。

var arr = ["a","b","c","d"];
for(var i = 0;i < arr.length;i++）
{
  console.log(arr[i]);
}
for(var i in arr）
{
 //這里的i是字符串，打印出來可以發現是“0”，“1”，“2”……
  console.log(arr[i]);
}
for(var i of arr）
{
  console.log(i);
}

forEach

更好的方式是直接使用iterable，內置的forEach方法，它接收一個函數，每次迭代就自動回調該函數。以Array為例：

var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) { 
// element: 指向當前元素的值 
// index: 指向當前索引 
// array: 指向Array對象本身 
alert(element);
});

注意，forEach()方法是ES5.1標準引入的，你需要測試瀏覽器是否支持。

Set與Array類似，但Set沒有索引，因此回調函數的前兩個參數都是元素本身：

var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) { 
alert(element);
});

Map的回調函數參數依次為value、key和map本身：

var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) { 
alert(value);
});

如果對某些參數不感興趣，由于JavaScript的函數調用不要求參數必須一致，因此可以忽略它們。例如，只需要獲得Array的element：

var a = ['A', 'B', 'C'];
a.forEach(function (element) { 
alert(element);
});

5-23更新：

語法

目前大多語言都是類C的，js也一樣（除了python ruby這些自成一派的）

• 區分大小寫
• 字符串可以用''或“”和python一樣
• 變量不區分類型，和python一樣（python不用寫var）
• 每條語句結尾可以省略分號
• 注釋與C,C++,java,php相同
• 代碼段要封閉與C,C++,java同（和python不一樣）
• 運算符完全和C一致，有自加自減，有逗號表達式，有條件運算符！！（和python不一樣）
• 邏輯運算符，條件，循環語句和C一致（和python不一樣）
• 有switch-case語句（和python不一樣）

數組

js的數組和python的list一樣可以存不同類型不同維度個數據，除了可以用下標查看修改數據外，還有幾個方法：

• push()：加到最后
• pop(): 從最后取
• shift(): 從開頭取
• unshift(): 加入開頭

構造數組的方式還有如下：（除了特別說明的外，都不改變原數組）

用map創建數組

var oldArray = [1,2,3,4]
var timesFour = oldArray.map(function(val){
  return val * 4;
});

用reduce壓縮數組

reduce的第2個參數（初始值）可選，如果沒有，就從數組第一個開始

var array = [4,5,6,7,8];
var sum = 0;
sum = array.reduce(function(pre,cur){
    return pre+cur;
},0);

用fliter過濾數組

如果我們只需要數組中小于6的元素

var oldArray = [1,2,3,4,5,6,7,8,9,10];
var newArray = oldArray.fliter(function(val){
  return val < 6;
});

數組排序sort

數組有排序的功能(會改變原數組，并且也會返回)，如果不帶參數，默認是按字符串排序，如果要改變排序方式，可以在里面增加比較函數，規則如下

• 負數：a在b前
• 大于：b在a前

var array = [1, 12, 21, 2];
//降序排序
array.sort(function(a,b){
   return  b-a;
});
//升序排序
array.sort(function(a,b){
   return  a-b;
});

逆轉數組reverse

改變原數組

var array = [1,2,3,4,5,6,7];
array.reverse();

數組拼接concat

var oldArray = [1,2,3];
var newArray = [];
var concatMe = [4,5,6];
newArray = oldArray.concat(concatMe);

字符串和數組轉換

• 用split切割字符串

var string = "Split me into an array";
var array = [];
array = string.split(' ');

• 用joint把數組拼接成字符串

var joinMe = ["Split","me","into","an","array"];
var joinedString = '';
joinedString = joinMe.join(' ');

范圍

在function之外的是全局變量，否則是局部變量
注意：如果沒加var 默認是全局變量！

// Declare your variable here
var myGlobal= 10;

function fun1() {
  // Assign 5 to oopsGlobal Here
  oopsGlobal = 5;
}

// Only change code above this line
function fun2() {
  var output = "";
  if (typeof myGlobal != "undefined") {
    output += "myGlobal: " + myGlobal;
  }
  if (typeof oopsGlobal != "undefined") {
    output += " oopsGlobal: " + oopsGlobal;
  }
  console.log(output);
}

輸出

console.log()

嚴格相等

嚴格相等（===）不僅比較值，還比較類型

因為在js中，7 == “7”

undefined

js中有undefined，當一個變量沒定義的時候，可以用下面方法判斷

if(typeof(value)=="undefined"){

alert("undefined");

} 

number

JavaScript不區分整數和浮點數，統一用Number表示，以下都是合法的Number類型：

123; // 整數
1230.456; // 浮點數
0.4561.2345e3; // 科學計數法表示
1.2345x1000，等同于1234.5
-99; // 負數
NaN; // NaN表示Not a Number，當無法計算結果時用NaN表示
Infinity; // Infinity表示無限大，當數值超過了JavaScript的Number所能表示的最大值時，就表示為Infinity

注意NaN
這個特殊的Number與所有其他值都不相等，包括它自己：

 NaN === NaN; // false

唯一能判斷NaN
的方法是通過isNaN()函數：
isNaN(NaN); // true

隨機數

js中的隨機數是用Math.random()生成的，同樣，也是返回(0,1)，如果要某個范圍，可以用下面的方法

    Math.floor(Math.random() * (ourMax - ourMin + 1)) + ourMin;

正則

js的正則是用的//，很慶辛的發現和vim很像，比如查找"in"可以用下面的正則：

    var testString = "How many non-space characters are there in this sentence?";   
    var expression = /in/gi;  
    var incount= testString.match(expression).length;

“/ /”包含的是正則內容

g 是全局

i 表示忽略大小寫

正則表達式都差不多，基本和python一致
除了 * . +
\d表示數字
\D表示非數字
\s表示空格
\S表示非空格
\w表示字符[0-9a-zA-Z_]（特別注意有個_）
\W表示非字符

Object 和 json

js中的object數據結構就類似其他語言中的map，hashmap，是一個鍵值對應的結構。javascript Object notation(JSON)其實也就是指在js中使用的這種數據交換的類型。

訪問的方式一般有兩種

• "." 如果是單純的數字或者沒空格的字符串，可以用
• "[]" 帶空格的就要用"[]"了。

舉例：

var ourDog = {
  "name": "Camper",
  "legs": 4,
  "tails": 1,
  "friends": ["everything!"]
};
var name = ourDog.name;  
name = ourDog["name"];
var prop= "name";
name = ourDog[prop];

`
你可以用Array或object嵌套

    var myStorage = {
      "car": {
        "inside": {
          "glove box": ["maps","phone"],
          "passenger seat": "crumbs"
         },
        "outside": {
          "trunk": "jack"
        }
      }
    };
    
    // get maps

    var gloveBoxContents = myStorage.car.inside["glove box"][0]; 

如果要刪除一個屬性，用delete

    delete ourDog.tails;

如果增加屬性，直接使用"."和"[]"就好了，和python差不多

如果要看某個屬性存在不存在 hasOwnProperty()：

    myObj.hasOwnProperty("top");

由于object的屬性和map很像，因此你可以用它來做查表操作：

    var alpha = {
      1:"Z",
      2:"Y",
      3:"X",
      4:"W",
      ...
      24:"C",
      25:"B",
      26:"A"
    };
    alpha[2]; // "Y"
    alpha[24]; // "C"

面向對象

js的面向對象可能是最“直觀”而又詭異的。

js可以直接用之前說的方式直接聲明一個Object對象

    var car = {
      "wheels":4,
      "engines":1,
      "seats":5
    };

也可以用構造函數的方法：

    var Car = function() {
      this.wheels = 4;
      this.engines = 1;
      this.seats = 1;
    };

創建實例直接用new就行了，然后創建的實例可以直接添加新的屬性。

var Car = function() {
  this.wheels = 4;
  this.engines = 1;
  this.seats = 1;
};

var myCar = new Car();
myCar.nickname = "coolcar";

私有變量，還記得var嗎？如果在類中用var就是局部變量了，也就意味著是私有變量了。如果不使用var，在js中默認是全局變量

    var Car = function() {
      // this is a private variable
      var speed = 10;
    
      // these are public methods
      this.accelerate = function(change) {
        speed += change;
      };
    
      this.decelerate = function() {
        speed -= 5;
      };
    
      this.getSpeed = function() {
        return speed;
      };
    };

為了避免大家因為忘記使用var而導致變量變成全局的這一缺陷，所有的JavaScript代碼都應該使用strict模式。我們在后面編寫的JavaScript代碼將全部采用strict模式。就是在所有的js程序前加上

use strict