學(xué)習(xí)可以到大神的官網(wǎng)學(xué)習(xí),http://www.liaoxuefeng.com/ 這里是做的筆記
運(yùn)行和調(diào)試
a. 如何運(yùn)行javascript
要讓瀏覽器運(yùn)行JavaScript，必須先有一個(gè)HTML頁(yè)面，在HTML頁(yè)面中引入JavaScript，然后，讓瀏覽器加載該HTML頁(yè)面，就可以執(zhí)行JavaScript代碼。
你也許會(huì)想，直接在我的硬盤上創(chuàng)建好HTML和JavaScript文件，然后用瀏覽器打開，不就可以看到效果了嗎？
這種方式運(yùn)行部分JavaScript代碼沒(méi)有問(wèn)題，但由于瀏覽器的安全限制，以'file://'開頭的地址無(wú)法執(zhí)行如聯(lián)網(wǎng)等JavaScript代碼，最終，你還是需要架設(shè)一個(gè)Web服務(wù)器，然后以'http://' 開頭的地址來(lái)正常執(zhí)行所有JavaScript代碼。
b. 調(diào)試:
使用Google Chrome瀏覽器，Chrome瀏覽器對(duì)開發(fā)者非常友好，可以讓你方便地調(diào)試JavaScript代碼
安裝后，隨便打開一個(gè)網(wǎng)頁(yè)，然后點(diǎn)擊菜單“查看(View)”-“開發(fā)者(Developer)”-“開發(fā)者工具(Developer Tools)”，瀏覽器窗口就會(huì)一分為二，下方就是開發(fā)者工具：
先點(diǎn)擊“控制臺(tái)(Console)“，在這個(gè)面板里可以直接輸入JavaScript代碼，按回車后執(zhí)行。
要查看一個(gè)變量的內(nèi)容，在Console中輸入console.log(a);，回車后顯示的值就是變量的內(nèi)容。
如果你對(duì)自己還有更高的要求，可以研究開發(fā)者工具的“源碼(Sources)”，掌握斷點(diǎn)、單步執(zhí)行等高級(jí)調(diào)試技巧。
引入javaScript方法;
JavaScript代碼可以直接嵌在網(wǎng)頁(yè)的任何地方，不過(guò)通常我們都把JavaScript代碼放到<head>中;
1.由<script>...</script>包含的代碼就是JavaScript代碼，它將直接被瀏覽器執(zhí)行。;
2.把JavaScript代碼放到一個(gè)單獨(dú)的.js文件，然后在HTML中通過(guò)<script src="..."></script>引入這個(gè)文件;
有些時(shí)候你會(huì)看到<script>標(biāo)簽還設(shè)置了一個(gè)type屬性：<script type="text/javascript">
但這是沒(méi)有必要的，因?yàn)槟J(rèn)的type就是JavaScript，所以不必顯式地把type指定為JavaScript。注釋
1.行注釋//...
2.塊注釋/..../-
數(shù)據(jù)類型和變量
1.注意兩個(gè)數(shù)據(jù);
NaN;//表示not a number 當(dāng)無(wú)法計(jì)算結(jié)果時(shí)用NAN表示
Infinity;//表示無(wú)限大,當(dāng)數(shù)值超過(guò)了JavaScript的Number所能表示的最大值時(shí)，就表示為Infinity
2.注意相等運(yùn)算符==JavaScript在設(shè)計(jì)時(shí)，有兩種比較運(yùn)算符;
1.==//會(huì)自動(dòng)轉(zhuǎn)換數(shù)據(jù)類型再進(jìn)行比較,很多時(shí)候會(huì)得到非常詭異的結(jié)果
2.===//不會(huì)自動(dòng)轉(zhuǎn)換數(shù)據(jù)類型,如果數(shù)據(jù)類型不一致,返回false,如果一致,再比較.
由于JavaScript這個(gè)設(shè)計(jì)缺陷，不要使用==比較,始終堅(jiān)持使用===比較;
3.NaN 這個(gè)特殊的Number與其他所有的值都不相等包括他自己;NaN===NaN;//false
唯一能判斷NaN的方法是通過(guò)isNaN()
4.注意浮點(diǎn)數(shù)的比較:1 / 3 === (1 - 2 / 3); // false
這不是JavaScript的設(shè)計(jì)缺陷。浮點(diǎn)數(shù)在運(yùn)算過(guò)程中會(huì)產(chǎn)生誤差，因?yàn)橛?jì)算機(jī)無(wú)法精確表示無(wú)限循環(huán)小數(shù)。要比較兩個(gè)浮點(diǎn)數(shù)是否相等，只能計(jì)算它們之差的絕對(duì)值，看是否小于某個(gè)閾值：
Math.abs(1 / 3 - (1 - 2 / 3)) < 0.0000001; // true
5.null和undefined
null表示一個(gè)空的空,它和0和''不同,0 是一個(gè)數(shù)值,''表示長(zhǎng)度為0的字符串.而null表示空
undefined表示未定義
JavaScript的設(shè)計(jì)者希望用null表示一個(gè)空的值，而undefined表示值未定義。事實(shí)證明，這并沒(méi)有什么卵用，區(qū)分兩者的意義不大。大多數(shù)情況下，我們都應(yīng)該用null。undefined僅僅在判斷函數(shù)參數(shù)是否傳遞的情況下有用。- strict模式
JavaScript在設(shè)計(jì)之初，為了方便初學(xué)者學(xué)習(xí)，并不強(qiáng)制要求用var申明變量。這個(gè)設(shè)計(jì)錯(cuò)誤帶來(lái)了嚴(yán)重的后果：如果一個(gè)變量沒(méi)有通過(guò)var申明就被使用，那么該變量就自動(dòng)被申明為全局變量：
，ECMA在后續(xù)規(guī)范中推出了strict模式，在strict模式下運(yùn)行的JavaScript代碼，強(qiáng)制通過(guò)var申明變量，未使用var申明變量就使用的，將導(dǎo)致運(yùn)行錯(cuò)誤。
啟用strict模式的方法是在JavaScript代碼的第一行寫上：'use strict'; - 字符串
單行字符串 '...' 或者 "..."
ES6新增:多行字符串...
字符串鏈接可以用+號(hào)
ES6新增模板字符串:表示方法和上面的多行字符串一樣，但是它會(huì)自動(dòng)替換字符串中的變量：這么讀取變量的值:$(變量名)
var name = '小明';
var age = 20;
var message = `你好, ${name}, 你今年${age}歲了!`; - 對(duì)象
JavaScript用一個(gè){...}表示一個(gè)對(duì)象，鍵值對(duì)以xxx: xxx形式申明，用,隔開。注意，最后一個(gè)鍵值對(duì)不需要在末尾加,，如果加了，有的瀏覽器（如低版本的IE）將報(bào)錯(cuò)。
訪問(wèn)屬性是通過(guò).操作符完成的，但這要求屬性名必須是一個(gè)有效的變量名。如果屬性名包含特殊字符，就必須用''括起來(lái)
var xiaohong = {
name: '小紅',
'middle-school': 'No.1 Middle School'
};
xiaohong的屬性名middle-school不是一個(gè)有效的變量，就需要用''括起來(lái)。訪問(wèn)這個(gè)屬性也無(wú)法使用.操作符，必須用['xxx']來(lái)訪問(wèn)：
xiaohong['middle-school']; // 'No.1 Middle School'
xiaohong['name']; // '小紅'
xiaohong.name; // '小紅'
判斷一個(gè)對(duì)象是否擁有某一個(gè)屬性,可以用in操作符 'name' in xiaohong; //true
in判斷一個(gè)屬性存在，這個(gè)屬性不一定是這個(gè)對(duì)象的,也可能是繼承來(lái)的.
要判斷一個(gè)屬性是不是對(duì)象自身?yè)碛卸皇菑母割惣蓙?lái)的用用hasOwnProperty()方法xiaohong.hasOwnProperty('name')
6.條件判斷 如果if的判斷語(yǔ)句不是true或者false 怎么辦
var s = '123';
if (s.length) { // 條件計(jì)算結(jié)果為3
//
}
JavaScript把null、undefined、0、NaN和空字符串''視為false，其他值一概視為true，因此上述代碼條件判斷的結(jié)果是true。
7.數(shù)組:
1.訪問(wèn)length屬性獲取數(shù)組長(zhǎng)度
2.與string類似,數(shù)組也可以用indexOf()來(lái)搜索一個(gè)指定元素的位置.存在返回索引(下標(biāo)),不存在返回-1;
3.slice()切片 對(duì)應(yīng)于string的substring();截取數(shù)組的部分元素,返回一個(gè)新的數(shù)組,(包括開始索引不包括結(jié)束索引)
如果不給slice()傳遞任何參數(shù)，它就會(huì)從頭到尾截取所有元素。利用這一點(diǎn)，我們可以很容易地復(fù)制一個(gè)Array：
var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(0, 3); // 從索引0開始，到索引3結(jié)束，但不包括索引3: ['A', 'B', 'C']
arr.slice(3); // 從索引3開始到結(jié)束: ['D', 'E', 'F', 'G']
4.push和pop
push() 向數(shù)組末尾添加若干元素,pop()則把Array的最后一個(gè)元素刪除.
5.unshift和shift
unshift向頭部添加若干元素,shift刪掉第一個(gè)元素
6.sort對(duì)數(shù)組進(jìn)行排序
7.reverse對(duì)數(shù)據(jù)進(jìn)行翻轉(zhuǎn)
8.splice修改數(shù)組的萬(wàn)能方法,可以從指定的索引開始刪除若干元素,然后再?gòu)脑撐恢锰砑尤舾稍?br> var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
// 從索引2開始刪除3個(gè)元素,然后再添加兩個(gè)元素:
arr.splice(2, 3, 'Google', 'Facebook'); // 返回刪除的元素 ['Yahoo', 'AOL', 'Excite']
arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
// 只刪除,不添加:
arr.splice(2, 2); // ['Google', 'Facebook']
arr; // ['Microsoft', 'Apple', 'Oracle']
// 只添加,不刪除:
arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],因?yàn)闆](méi)有刪除任何元素
arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
9.concat 把當(dāng)前數(shù)組和另一個(gè)數(shù)組鏈接,返回一個(gè)新的數(shù)組;
concat()方法并沒(méi)有修改當(dāng)前Array，而是返回了一個(gè)新的Array。
實(shí)際上，concat()方法可以接收任意個(gè)元素和Array，并且自動(dòng)把Array拆開，然后全部添加到新的Array里：
10.join()方法是一個(gè)非常實(shí)用的方法，它把當(dāng)前Array的每個(gè)元素都用指定的字符串連接起來(lái)，然后返回連接后的字符串：
8.Map和Set
JavaScript的對(duì)象可以視為其他語(yǔ)言的Map或者Dictionary,JavaScript的對(duì)象鍵必須是字符串,但實(shí)際上Number或者其他數(shù)據(jù)類型作為鍵也是非常合理的。
為了解決這個(gè)問(wèn)題,ES6規(guī)范,引入的新的數(shù)據(jù)類型Map
Map是一組鍵值對(duì)的結(jié)構(gòu)，具有極快的查找速度。
初始化Map需要一個(gè)二維數(shù)組，var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);
或者直接初始化一個(gè)空Map。Map具有以下方法：
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'
m.get('Adam'); // undefined
由于一個(gè)key只能對(duì)應(yīng)一個(gè)value，所以，多次對(duì)一個(gè)key放入value，后面的值會(huì)把前面的值沖掉：
Set
Set和Map類似，也是一組key的集合，但不存儲(chǔ)value。由于key不能重復(fù)，所以，在Set中，沒(méi)有重復(fù)的key。
要?jiǎng)?chuàng)建一個(gè)Set，需要提供一個(gè)Array作為輸入，或者直接創(chuàng)建一個(gè)空Set：
var s1 = new Set(); // 空Set
var s2 = new Set([1, 2, 3]); // 含1, 2, 3
通過(guò)add(key)方法可以添加元素到Set中，可以重復(fù)添加，但不會(huì)有效果：
通過(guò)delete(key)方法可以刪除元素：
iterable
遍歷Array可以采用下標(biāo)循環(huán)，遍歷Map和Set就無(wú)法使用下標(biāo)。為了統(tǒng)一集合類型，ES6標(biāo)準(zhǔn)引入了新的iterable類型，Array、Map和Set都屬于iterable類型。
具有iterable類型的集合可以通過(guò)新的for ... of循環(huán)來(lái)遍歷。
for ... of循環(huán)，它只循環(huán)集合本身的元素：
更好的方式是直接使用iterable內(nèi)置的forEach方法，它接收一個(gè)函數(shù)，每次迭代就自動(dòng)回調(diào)該函數(shù)。以Array為例：
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向當(dāng)前元素的值
// index: 指向當(dāng)前索引
// array: 指向Array對(duì)象本身
alert(element);
});
forEach()方法是ES5.1標(biāo)準(zhǔn)引入的，你需要測(cè)試瀏覽器是否支持。
Set與Array類似，但Set沒(méi)有索引，因此回調(diào)函數(shù)的前兩個(gè)參數(shù)都是元素本身：
var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
alert(element);
});
Map的回調(diào)函數(shù)參數(shù)依次為value、key和map本身：
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
alert(value);
});
如果對(duì)某些參數(shù)不感興趣，由于JavaScript的函數(shù)調(diào)用不要求參數(shù)必須一致，因此可以忽略它們。例如，只需要獲得Array的element：
var a = ['A', 'B', 'C'];
a.forEach(function (element) {
alert(element);
});
- strict模式
