數組:
ES5裏面新增一些東西
循環:
1. for
for(let i=0; i<arr.length; i++)
2. while
arr.forEach() // 代替普通for
arr.forEach(function(val, index, arr){
console.log(val, index, arr);
});
arr.map() // 非常有用，做數據交互 "映射"
正常情況下，需要配合return，返回是一個新的數組
若是沒有return，相當於forEach
注意：平時只要用map，一定是要有return
重新整理數據結構:
[{title:'aaa'}] -> [{t:'aaaa'}]
arr.filter(): 過濾，過濾一些不合格“元素”， 如果回調函數返回true，就留下來
arr.some(): 類似查找, 數組裏面某一個元素符合條件，返回true
arr.every(): 數組裏面所有的元素都要符合條件，才返回true
其實他們可以接收兩個參數:
arr.forEach/map...(循環回調函數, this指向誰);
------------------------------------------------------------
arr.reduce() //從左往右
求數組的和、階乘
arr.reduceRight() //從右往左
------------------------------------------------------------
ES2017新增一個運算符:
冪
Math.pow(2,3)
2 ** 3
for….of….：
arr.keys() 數組下標
arr.entries() 數組某一項
for(let val of arr){
console.log(val);
}
擴展運算符:
…
let arr =[1,2,3];
let arr2 = [...arr];
let arr2 = Array.from(arr);
Array.from:
作用: 把類數組(獲取一組元素、arguments…) 對象轉成數組
個人觀點： 具備 length這個東西，就靠譜
Array.of(): 把一組值，轉成數組
let arr = Array.of(‘apple’,’banana’,’orange’);
console.log(arr);
arr.find(): 查找，找出第一個符合條件的數組成員，如果沒有找到，返回undefined
arr.findIndex(): 找的是位置， 沒找到返回-1
arr.fill() 填充
arr.fill(填充的東西, 開始位置, 結束位置);
在ES2016裏面新增:
arr.indexOf()
arr.includes()
str.includes()
對象:
json
對象簡介語法(相當有用):
let json ={
a:1,
b:2,
showA:function(){
return this.a;
}
showB:function(){
return this.b;
}
}
let json ={
a,
b,
showA(){ //個人建議: 一定注意，不要用箭頭函數
},
showB(){
}
}
new Vuex.Store({
state,
mutation,
types,
actions
});
new Vue({
router,
App,
vuex
})
Object.is(): 用來比較兩個值是否相等
Object.is('a','a');
比較兩個東西相等:
==
===
Object.is(NaN, NaN);
Object.is(+0, -0);
Object.assign(): 用來合併對象
let 新的對象 = Object.assign(目標對象, source1, srouce2….)
function ajax(options){ //用戶傳
let defaults={
type:'get',
header:
data:{}
....
};
let json = Object.assign({}, defaults, options);
.....
}
用途:
1. 複製一個對象
2. 合併參數
ES2017引入:
Object.keys()
Object.entries();
Object.values();
let {keys, values, entries} = Object;let {keys, values, entries} = Object;
對象身上: 計劃在ES2018引入
…
let json = {a:3, b:4};
let json2 = {...json};
==================================================
Promise: 承諾，許諾
作用: 解決異步回調問題
傳統方式，大部分用回調函數，事件
ajax(url,{ //獲取token
ajax(url,()=>{ //獲取用戶信息
ajax(url, ()=>{
//獲取用戶相關新聞
})
})
})
語法:
let promise = new Promise(function(resolve, reject){
//resolve, 成功調用
//reject 失敗調用
});
promise.then(res=>{
}, err=>{
})
promise.catch(err=>{})
本人用法:
new Promise().then(res=>{
}).catch(err=>{
})
Promise.resolve('aa') : 將現有的東西，轉成一個promise對象， resolve狀態，成功狀態
等價於:
new Promise(resolve =>{
resolve('aaa')
});
Promise.reject('aaa'): 將現有的東西，轉成一個promise對象，reject狀態，失敗狀態
等價於:
new Promise((resolve, reject) =>{
reject('aaa')
});
√ Promise.all([p1, p2, p3]): 把promise打包，扔到一個數組裏面，打包完還是一個promise對象
必須確保，所有的promise對象，都是resolve狀態，都是成功狀態
Promise.race([p1, p2, p3]): 只要有一個成功，就返回
用戶登錄 -> 用戶信息
模塊化:
js不支持模塊化
ruby require
python import
在ES6之前，社區制定一套模塊規範:
Commonjs 主要服務端 nodeJs require('http')
AMD requireJs, curlJs
CMD seaJs
ES6出來，同意服務端和客戶端模塊規範:
import {xx} ddd
Math.pow()
Math.abs()
import {pow, abs} from 'Math' 我自己瞎想
模塊化：
注意： 需要放到服務器環境
a). 如何定義模塊？
export 東西
export const a =12;
export{
a as aaa,
b as banana
}
b). 如何使用?
import
import './modules/1.js';
import {a as a, banana, c} from './modules/2.js'
import * as modTwo from './modules/2.js';
使用模塊:
<script type="module"></script>
import: 特點
a). import 可以是相對路徑，也可以是絕對路徑
import 'https://code.jquery.com/jquery-3.3.1.js';
b). import模塊只會導入一次，無論你引入多少次
c). import './modules/1.js'; 如果這麼用，相當於引入文件
d). 有提升效果，import會自動提升到頂部，首先執行
e). 導出去模塊內容，如果裏面有定時器更改，外面也會改動，不想Common規範緩存
* import() 類似node裏面require， 可以動態引入, 默認import語法不能寫到if之類裏面
返回值，是個promise對象
import('./modules/1.js').then(res=>{
console.log(res.a+res.b);
});
優點:
1. 按需加載
2. 可以寫if中
3. 路徑也可以動態
Promise.all([])
=============================================
ES2017加 async await:
'use strict' 以後默認就是嚴格模式