在函數(shù)中不定義return就會調(diào)用默認的隱形return优训，就是return undifind!!!
字符串部分：
es6用反引號表示多行字符串，就是1左邊那個案件。
用?`你好, ${name}, 你今年${age}歲了!`代替+號拼接的字符串?'你好, '?+ name +?', 你今年'?+ age +?'歲了!'
打點調(diào)用：
toUpperCase()把一個字符串全部變?yōu)榇髮?/p>
toLowerCase()把一個字符串全部變?yōu)樾?/p>
indexOf()會搜索指定字符串出現(xiàn)的位置
substring()返回指定索引區(qū)間的子串
數(shù)組部分：
slice()就是對應String的substring()版本，它截取Array的部分元素，然后返回一個新的Array
push()向Array的末尾添加若干元素搞旭，pop()則把Array的最后一個元素刪除掉
如果要往Array的頭部添加若干元素，使用unshift()方法菇绵，shift()方法則把Array的第一個元素刪掉
sort()可以對當前Array進行排序肄渗，它會直接修改當前Array的元素位置，直接調(diào)用時咬最，按照默認順序排序
reverse()把整個Array的元素給掉個個翎嫡，也就是反轉(zhuǎn)
splice()方法是修改Array的“萬能方法”，splice(a,b,c,d)從索引a開始刪除b個元素然后添加c,d元素
concat()方法把當前的Array和另一個Array連接起來永乌，并返回一個新的Array
join()方法是一個非常實用的方法惑申，它把當前Array的每個元素都用指定的字符串連接起來，然后返回連接后的字符串
對象部分：
正則：
^?? ?以翅雏。圈驼。。開頭
$?? ?以望几。绩脆。。結(jié)尾
\w?? ?匹配字母或數(shù)字
\d? ? 匹配數(shù)字
.? ? 可以匹配任意字符
\s? ? 匹配一個空格
*匹配任意個字符(包括0個)
+? ? 表示至少一個字符
橄抹？? ? 表示0或1個字符
{n,m}? ? 表示n到m個字符 ? ? ?
[0-9a-zA-Z\_]可以匹配一個數(shù)字靴迫、字母或者下劃線
^(\d{3})-(\d{3,8})$分別定義了兩個組在RegExp對象上用exec()方法提取出子串
加個?就可以讓\d+采用非貪婪匹配
當我們指定g標志后，每次運行exec()楼誓，正則表達式本身會更新lastIndex屬性矢劲，表示上次匹配到的最后索引
指定i標志，表示忽略大小寫慌随，m標志，表示執(zhí)行多行匹配。
JSON：
如果只想輸出指定屬性阁猜，就用數(shù)組：JSON.stringify(xiaoming, ['name', 'skills'], ' ');
解析json就JSON.parse()
面向?qū)ο螅?/p>
把要給a對象的原型指向B丸逸，看上去a就像從b繼承的，a就擁有自己的屬性和B的方法剃袍。
關于原型：
arr ---->?Array.prototype ----> Object.prototype ---->?null
對于一個數(shù)組的原型鏈來說黄刚，數(shù)組的方法都定義在了array.prototype上，所以arr可以直接調(diào)用這些方法而不用聲明
使用構造函數(shù)去新建對象：
function?Student(name) {
this.name = name;
this.hello =?function?() {
alert('Hello, '?+?this.name +?'!');
}
}
然后直接var obj = new Student("..."),這樣的話民效，每一個用此構造函數(shù)聲明的對象都會具有hello這個函數(shù)憔维。
function(){}():函數(shù)定義+（）會自動執(zhí)行一次；
關于遍歷：
遍歷中最常用的就是for循環(huán)畏邢；for(定義;判斷;判斷變量改變){執(zhí)行條件}业扒；但是這個也是最不好用的遍歷方法，應為這個方法效率較低舒萎，會占用大量運存程储；
一般來說對于對象，最好時用for臂寝。章鲤。。in來遍歷咆贬，便利完了之后輸出的是某鍵值對的值败徊，格式是字符串。
for(var a in obj){alert (a)};這里的a是臨時的一個變量掏缎，每次循環(huán)都會把對應的鍵值以string的格式保存在a中皱蹦，a每次只保存一個string，循環(huán)結(jié)束后保留最后一個鍵值御毅；如果只想找到對象自身的屬性根欧，而不是通過原型繼承過來的就obj.hasOwnProperty(a);這個為true就是自己有的；如果用這個來遍歷數(shù)組那得到的是a就是數(shù)組的每個索引值端蛆；
while和do ? while就是滿足條件運行凤粗，不然就結(jié)束，不過dowhile是先執(zhí)行一次在判斷今豆；
關于map和set結(jié)構（類型）
map是es6里新定義的一組鍵值對的結(jié)構：var m=new Map()/new Map([['6666',1],['jame',2]);如此從map中取鍵值對就很塊：m.get('jame')得到的就是2嫌拣；初始化一個map需要一個空或者一個二維數(shù)組；有以下方法：
var?m =?new?Map();?// 空Map
m.set('Adam',?67);?// 添加新的key-value
m.has('Adam');?// 是否存在key 'Adam': true
m.get('Adam');?// 67
m.delete('Adam');?// 刪除key 'Adam'
m.get('Adam');?// undefined
因為一個鍵名只能對應一個鍵值呆躲，所以多次存儲鍵值會覆蓋异逐；
對于set而言其實是跟map一樣的，不過map不存儲value插掂，只是一組key的集合灰瞻，由于key是不可重復的腥例，所以set中沒有重復的元素，初始化一個set需要空或者一個數(shù)組酝润，重復元素會被自動剔除燎竖；?s.add(4)通過add可以添加元素
對于map和set而言都不具備下標，即索引要销，所以是不能用for進行循環(huán)遍歷的构回，為此es6引入了新的iterable類型，數(shù)組疏咐，mapset都是這個類型纤掸，是可以通過for ? of遍歷?
而for ? of的用法和for in是一樣的，區(qū)別在于for in會遍歷額外添加的屬性浑塞，而for of只會遍歷集合本身的屬性
或者直接使用forEach()是es5引入的借跪；用foreach接收一個函數(shù)，每一次遍歷就會回掉該函數(shù)
例如
var?a = ['A',?'B',?'C'];
var?s =?new?Set(['A',?'B',?'C']);
var?m =?new?Map([[1,?'x'], [2,?'y'], [3,?'z']]);
a.forEach(function?(element, index, array) {
// element: 指向當前元素的值
// index: 指向當前索引
// array: 指向Array對象本身
alert(element);
});
s.forEach(function?(element, sameElement, set) {
alert(element);
});
m.forEach(function?(value, key, map) {
alert(value);
});
對于函數(shù)：對于函數(shù)而言有一個只在函數(shù)內(nèi)部有用的關鍵字：arguments缩举，永遠指向當前函數(shù)的傳入所有參數(shù)垦梆；rest參數(shù)是只能夠?qū)懺谧詈蟮男螀ⅲ瑢懽?..rest,實際的傳參多于形參的部分會被填充成數(shù)組存在rest下仅孩。
變量作用域：
在函數(shù)內(nèi)部定義托猩，就只作用于內(nèi)部，外部無法調(diào)用辽慕，如果定義在使用之后京腥，會自動提升變量的聲明，但是不會提升變量的賦值溅蛉，全局定義的變量會綁定到window上公浪，最好是定義一個全局變量，然后把所有的變量和函數(shù)定義到這個全局變量之中船侧，就不會出現(xiàn)文件的沖突了欠气。使用let在局部作用域中聲明變量；用const來聲明一個常量镜撩。
方法：
方法就是綁定到對象上的函數(shù)：
var?xiaoming = {
name:?'小明',
birth:?1990,
age:?function?() {
var?y =?new?Date().getFullYear();
return?y -?this.birth;
}
};
xiaoming.age;?// function xiaoming.age()
xiaoming.age();?// 今年調(diào)用是25,明年調(diào)用就變成26了
this是指向調(diào)用時的對象预柒；最好在使用的時候現(xiàn)在函數(shù)內(nèi)部定義var that = this;先用that捕獲到this指向的函數(shù)，然后用that袁梗。調(diào)用宜鸯，定義其他函數(shù)；
或者是使用apply（）這是函數(shù)本身的方法：age.apply(a,b)意思是this指向A遮怜，傳入?yún)?shù)為B淋袖。
可以用作計數(shù)：
var?count =?0;
var?oldParseInt = parseInt;?// 保存原函數(shù)
window.parseInt =?function?() {
count +=?1;
return?oldParseInt.apply(null, arguments);?// 調(diào)用原函數(shù)
};
// 測試:
parseInt('10');
parseInt('20');
parseInt('30');
count;?// 3
關于一些方法：
map():
遍歷數(shù)組；就是把一個函數(shù)作用在每一個元素上并生成一個新的數(shù)組
function?pow(x) {
return?x * x;
}
var?arr = [1,2,3,4,5,6,7,8,9];
arr.map(pow);?// [1, 4, 9, 16, 25, 36, 49, 64, 81]
reduce():
把一個函數(shù)輪流作用在每個元素上并返回一個值：
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
filter()：
和map()差不多锯梁，但是是依次作用于數(shù)組之后返回一個布爾值即碗，根據(jù)布爾值決定是否保留該元素焰情；true就保留，false就不保留剥懒；
var?arr = [1,?2,?4,?5,?6,?9,?10,?15];
var?r = arr.filter(function?(x) {
return?x %?2?!==?0;
});
r;?// [1, 5, 9, 15]
在filter里接受的回掉函數(shù)可以有多個參數(shù)額烙样，通常是某個元素，位置蕊肥，數(shù)字本身，也就是(element,index,self)
所以去重的話;r = arr.filter(function (element, index, self) {
????return self.indexOf(element) === index;
});
就可以了
sort();
對于sort蛤肌，是一種快速地數(shù)組排序方法壁却，arr.sort()但是排序的默認依據(jù)是ASCII碼，如果需要使用自定的規(guī)則：
var?arr = [10,?20,?1,?2];
arr.sort(function?(x, y) {
if?(x < y) {
return?-1;
}
if?(x > y) {
return?1;
}
return?0;
});?// [1, 2, 10, 20]
而且sort方法是直接對數(shù)組的修改裸准，他返回的結(jié)果是當前的數(shù)組展东。
閉包：
不立即調(diào)用該函數(shù)，在后面按需調(diào)用：
function?lazy_sum(arr) {
var?sum =?function?() {
return?arr.reduce(function?(x, y) {
return?x + y;
});
}
return?sum;
}
在調(diào)用的時候返回的是求和函數(shù)
箭頭函數(shù)
x=>x*x ? ? ? ? ? ?相當于 function(x){return x*x}
如果有多個參數(shù)需要定義的時候就為
(x, y) => x * x + y * y
如果有多條執(zhí)行語句的時候就?
x => {
if?(x >?0) {
return?x * x;
}
else?{
return?- x * x;
}
}
如果需要返回一個對象的時候就外加()
x => ({ foo: x })
重點在于炒俱，箭頭函數(shù)內(nèi)部的this指向是詞法作用域盐肃，即誰調(diào)用，就指向誰权悟，所以使用箭頭函數(shù)的時候就不用var _this=this;這種提前鎖定this指向的寫法
ES6
es6新引進了一種數(shù)據(jù)類型砸王，就是generator；
定義如下:
function* foo(x) {
yield?x +?1;
yield?x +?2;
return?x +?3;
}
在執(zhí)行的時候峦阁，可以返回多個值谦铃，但是如果直接調(diào)用的話是不會返回所需要的值的，他只是創(chuàng)建了一個generator對象榔昔，并沒有去執(zhí)行驹闰，調(diào)用而言一種是不斷的調(diào)用該對象的next()方法：next()方法可以帶一個參數(shù)，該參數(shù)就會被當作上一個yield表達式的返回值
var a = foo（5）
a.next();? ? 返回的是{value:6,done:false;}
a.next();? ? 返回的是{value:7,done:false;}
a.next();? ? 返回的是{value:8,done:true;}
在返回的對象中撒会，value代表的是運行一次之后的值嘹朗，done代表的是這個generator是否完全執(zhí)行完。
第二種調(diào)用方式就是：直接用for...of 調(diào)用诵肛，這樣不用我們自己判斷done的值屹培；這種用法不會返回最后自己定義的return的返回值，只會執(zhí)行yield的操作并返回值曾掂。
for?(var?x of foo(5)) {
console.log(x);?// 依次輸出6惫谤，7
}
瀏覽器對象
window?表示當前瀏覽器的窗口，這個對象有innerWidth和innerHeight屬性珠洗，可以獲取瀏覽器的可視區(qū)域的寬高溜歪，兼容至ie8。
還有outerWidth和outerHeight獲取整個瀏覽器的窗口寬高许蓖。
navigator表示瀏覽器的信息蝴猪，最常用的屬性：appName瀏覽器名稱调衰，appVersion瀏覽器版本，language瀏覽器設置的語言自阱，platform操作系統(tǒng)類型嚎莉，userAgent瀏覽器設定的User-Agent字符串。
/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ??true?:?false;判斷是否是移動端
screen表示屏幕的信息沛豌，常用的屬性：width屏幕寬度,height屏幕高度,colorDepth顏色位數(shù)
location表示當前頁面的url信息趋箩。location.href可以獲取到完整的url。
加載一個新頁面就location.assign()加派，重新加載調(diào)用location.reload()
document表示當前頁面叫确，是整個dom樹的根節(jié)點。document對象有個cookie屬性芍锦，可以獲取到到當前頁面的cookie竹勉，因此服務器再設置cookie的時候必須使用httpOnly這個選項設定cookie不能被js所讀取
history表存了瀏覽器的歷史紀錄，js可以調(diào)用history的back()和forward()功能就相當于是用戶點擊了瀏覽器的后退/前進按鈕娄琉。由于ajax調(diào)用的話次乓，最好是不要使用到history這個東西。
可以使用parentElement.insertBefore(newElement, referenceElement);孽水，子節(jié)點會插入到referenceElement之前票腰。
表單
md5 提交的時候：
要想不改變用戶的輸入，可以利用<input type="hidden">實現(xiàn)：
<!-- HTML --><form?id="login-form"?method="post"?onsubmit="return checkForm()">
<input?type="text"?id="username"?name="username">
<input?type="password"?id="input-password">
<input?type="hidden"?id="md5-password"?name="password">
<button?type="submit">Submit</button></form>
<script>function?checkForm() {
var?input_pwd = document.getElementById('input-password');
var?md5_pwd = document.getElementById('md5-password');
// 把用戶輸入的明文變?yōu)镸D5:
md5_pwd.value = toMD5(input_pwd.value);
// 繼續(xù)下一步:
return?true;
}
</script>
用return：true來確定繼續(xù)提交匈棘，如果不符合規(guī)定就return false丧慈。
操作文件：
當一個表單包含<input type="file">時，表單的enctype必須指定為multipart/form-data主卫，method必須指定為post逃默，瀏覽器才能正確編碼并以multipart/form-data格式發(fā)送表單的數(shù)據(jù)。
對于文件格式的處理簇搅，只能靠判斷后綴名來處理：
varf = document.getElementById('test-file-upload');
var?filename = f.value;?// 'C:\fakepath\test.png'if?(!filename || !(filename.endsWith('.jpg') || filename.endsWith('.png') || filename.endsWith('.gif'))) {
alert('Can only upload image file.');
return?false;
}
h5的file api提供了file 和file reader完域，下面的代碼演示讀取用戶選取圖片并預覽。
var
fileInput = document.getElementById('test-image-file'),
info = document.getElementById('test-file-info'),
preview = document.getElementById('test-image-preview');
// 監(jiān)聽change事件:
fileInput.addEventListener('change',?function?() {
// 清除背景圖片:
preview.style.backgroundImage =?'';
// 檢查文件是否選擇:
if?(!fileInput.value) {
info.innerHTML =?'沒有選擇文件';
return;
}
// 獲取File引用:
var?file = fileInput.files[0];
// 獲取File信息:
info.innerHTML =?'文件: '?+ file.name +?'<br>'?+
'大小: '?+ file.size +?'<br>'?+
'修改: '?+ file.lastModifiedDate;
if?(file.type !==?'image/jpeg'?&& file.type !==?'image/png'?&& file.type !==?'image/gif') {
alert('不是有效的圖片文件!');
return;
}
// 讀取文件:
var?reader =?new?FileReader();
reader.onload =?function(e) {
var
data = e.target.result;?// 'data:image/jpeg;base64,/9j/4AAQSk...(base64編碼)...'
preview.style.backgroundImage =?'url('?+ data +?')';
};
// 以DataURL的形式讀取文件:
reader.readAsDataURL(file);
});
ajax：
異步請求
function Ajax(type, url, data, success, failed){
// 創(chuàng)建ajax對象
var request = new XMLHttpRequest(); // 新建XMLHttpRequest對象
// 連接服務器open
if(type == 'GET'){
if(data){
xhr.open('GET', url + '?' + data, true);
} else {
xhr.open('GET', url + '?t=' + random, true);
}
// 發(fā)送請求
xhr.send();
} else if(type == 'POST'){
xhr.open('POST', url, true);
// 如果需要像 html 表單那樣 POST 數(shù)據(jù)瘩将，請使用 setRequestHeader() 來添加 http 頭吟税。
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(data);
}
// 處理返回數(shù)據(jù)
request.onreadystatechange = function () { // 狀態(tài)發(fā)生變化時，函數(shù)被回調(diào)
????if (request.readyState === 4) { // 成功完成
????????// 判斷響應結(jié)果:
????????if (request.status === 200) {
????????????// 成功姿现，通過responseText拿到響應的文本:
????????????return success(request.responseText);
????????} else {
????????????// 失敗肠仪，根據(jù)響應碼判斷失敗原因:
????????????return fail(request.status);
????????}
????} else {
????????// HTTP請求還在繼續(xù)...
????}
}
原生的看看就行了，用的不多备典；
判斷數(shù)據(jù)類型：
console.log([].constructor == Array);
console.log({}.constructor == Object);
console.log("string".constructor == String);
console.log((123).constructor == Number);
console.log(true.constructor == Boolean);
或者使用instanceof
(a instanceof Array) ? //a是否Array的實例异旧？true or false
(a.constructor == Array) ?// a實例所對應的構造函數(shù)是否為Array? true or false
以上只能判斷當前頁面內(nèi)部定義的東西，如果跨頁面調(diào)用怎會出錯
function isArray(o) {
? ? returnObject.prototype.toString.call(o) === ‘[object Array]‘;
}
所以判斷數(shù)組最好是用這個Array.isArray（“提佣。吮蛹。荤崇。”）
