es6的新增方法和es5陣列的一些方法
阿新 • • 發佈：2018-12-29
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script> // 大多數情況下，es5的陣列方法接受的第一個引數為一個函式，並且對陣列的每個元素呼叫一次該函式。 // 該函式有三個引數：陣列元素，元素的索引和陣列本身。 // 如果有第二個引數，則第一個引數中的this指向第二個引數。 var arr= [1,2,3,4,5]; var result; //forEach()============================= //從頭到尾遍歷陣列，為每個元素呼叫指定的函式。 //返回值：undefined 無 //原陣列不改變 //計算和 // var sum =0; // arr.forEach(function(val,index,a){ // sum+=val; // console.log(val,index,a) // }) // console.log(sum,arr); // //每個陣列元素值+1 // result=arr.forEach(function(val,i){ // arr[i]=val+1; // // break; //直接break會報錯，forEach中沒法終止遍歷// }) // console.log(arr); // console.log(result); //undefined //map()====================================== //將呼叫的陣列的每個元素傳遞給指定的函式，並返回一個數組，它包含該函式的返回值 //原陣列不改變,而會返回一個新陣列 // result = arr.map(function(x){ // return x*x; //一定要有return，否則返回undefined // }) // console.log(result,arr); //filter()==================================== //filter方法返回的陣列元素是呼叫的陣列的一個子集。傳遞的函式是用來邏輯判定的。該函式返回true或false。 //原陣列不改變 // var result1 = arr.filter(function(v,i,a){ // return v>3; // }) // [4, 5] // console.log(result1) // var result2= arr.filter(function(v){ // return v%2; // }) //[1, 3, 5] // console.log(arr,result2); // // filter方法可以把稀疏陣列中的空元素篩出去 // var result3 = arr.filter(function(v){ // return v!=undefined &&v!=null; // }); // console.log(arr,result3); // every()和some()============================ //every和some是陣列的邏輯判定：他們對陣列元素應用指定的函式進行判定，返回true或false // every()方法就像數學中的“針對所有”的量詞：當且僅當針對陣列中的所有元素呼叫判定函式都返回true，它才返回true // result = arr.every(function(x){ // return x<10; // }) // console.log(result); // result = arr.every(function(x){ // return x%2===0; // }) // console.log(result); // some()方法就像數學中的“存在”的量詞：當陣列中至少有一個元素呼叫判定函式返回true，它就返回true，並且當且僅當數值中的所有元素呼叫判定函式都返回false，它才返回false // result = arr.some(function(v){ // return v%2===0; // }) // console.log(result); //一旦every()和some()確認該返回什麼值他們就會停止遍歷陣列元素 // some在判定第一個元素返回true就停止遍歷返回true，否則遍歷整個陣列直到遇到true // every在判定第一個元素返回false就停止遍歷，否知就一直遍歷直到遇到false為止 //reduce()和reduceRight()===================== //reduce()和reduceReight()方法使用指定的函式將陣列元素進行組合，生成單個值。這在函數語言程式設計中是常見的操作，也可以稱為“注入”和“摺疊” //返回值為化簡函式最後一次返回的結果 //陣列求積 // var product = arr.reduce(function(x,y,z,a){ // console.log(x,y,z,a); // return x*y; // }) // console.log(product); // //陣列求和 // var sum = arr.reduce(function(x,y,z,a){ // console.log(x,y,z,a); // return x+y; // }); // console.log(sum); // //陣列求最大值 // var max = arr.reduce(function(x,y){ // return x>y?x:y; // }) // console.log(max); // reduce()需要兩個引數。第一個是執行化簡操作的函式。化簡函式的任務就是用某種方法把兩個值組合或化簡為一個值，並返回化簡後的值。 //化簡函式function(初始值或者上一次化簡函式的返回值，陣列元素，元素的索引，陣列本身) // 第二個引數是一個傳遞給函式的初始值,當不指定初始值時，他將陣列元素的第一個值作為其初始值 // reduceRight()===================== // reduceRight()的工作原理和reduce()一樣，不同的是它按照陣列索引從高到低（從右到左）處理陣列。 // var product = arr.reduceRight(function(x,y,z,a){ // console.log(x,y,z,a); // return x*y; // },1) // console.log(product); //indexOf()和lastIndexOf()===================== </script> </body> </html>
1.let
塊作用域
const
常量，不能二次賦值
2.箭頭函式
(引數)=>{邏輯程式碼}
引數為1時
引數=>{}
引數不為一時
()=>{}
返回值為值型別
()=>1
返回值為物件時
()=>({a:a})
其他情況
()=>{}
箭頭函式中的this跟包裹他的程式碼共享this，通常用在回撥函式中
setTimeout(()={},1000)
3.增強的物件字面量
var o={
__proto__:parent, //繼承
name, //屬性簡寫
fun(){ //方法簡寫
super.fun(); //呼叫父級物件上的方法
},
["prpp"+(()=>10)]:110 //動態屬性
}
4.類
class extends constructor super static
class 類名{
constructor(建構函式的引數){
this.屬性名=“”
}
//公有方法
fun(引數){
//邏輯程式碼
return
}
//靜態方法的定義
static fun(){}
}
var a = new 類名（）;
靜態方法的呼叫
類名.方法名();
子類
class 子類 extends 父類，父類{
constructor(){
super(); //繼承父類上的屬性方法以及靜態方法
this.子類的屬性
}
//子類的方法
fun(){
super.fun()
}
}
5.模板字串
var str = `
${變數名}
`
6.解構
es6按照一定的模式從陣列和物件中提取值，
7.預設引數
function f(x,y=10){
}
不定引數
function fun(x,...y){
}
fun(1,1,2,3)
擴充套件運算子...
function fun(x,y,z){
}
fun(...arr)