本人最近學習es6一些方法,難免有些手癢,想著能不能將這些方法總結下,如下
1、陣列的擴充套件
1)首先什麼是偽陣列
無法直接呼叫陣列方法或期望length屬性有什麼特殊的行為,但仍可以對真正陣列遍歷方法來遍歷它們,例如:函式的argument引數,呼叫getelementsbytagname,
document.childnodes等等
2、函式擴充套件
document.queryselectorall('元素') 相當於 document.getelementsbytagname('元素') 一樣
合併陣列
// es5[1, 2].concat(more)
// es6
[1, 2, ...more]
var arr1 = ['a', 'b'];
var arr2 = ['c'];
var arr3 = ['d', 'e'];
// es5的合併陣列
arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]
// es6的合併陣列
[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]
字串
es6預設都是屬於嚴格模式下,「...」為擴充套件運算子
let str = 'x\ud83d\ude80y';str.split('').reverse().join('')
//'y\ude80\ud83dx'
[...str].reverse().join('')
//'y\ud83d\ude80x'
name屬性
函式的name
屬性,返回該函式的函式名。
function fn() {}fn.name // "fn"
箭頭函式
// 巢狀的箭頭函式function insert(value) };
}};}insert(2).into([1, 3]).after(1); //[1, 2, 3]
// 使用箭頭函式
let insert = (value) => (})});
insert(2).into([1, 3]).after(1); //[1, 2, 3]
現在問題來了,什麼是鏈式呼叫?
解答:其實,上面的**可以說是一種鏈式呼叫,使用物件導向寫,裡面寫幾個方法,就像如下**一樣,jquery中ajax使用promise一樣,將非同步用同步流程表達出來。
var lianshi = function()lianshi.prototype = ,
show:function(),
hide:function()
};var lianshi = new lianshi();
lianshi.css().css().show().hide();
箭頭函式注意的四點:
(1)函式體內的this
物件,就是定義時所在的物件,而不是使用時所在的物件。
(2)不可以當作建構函式,也就是說,不可以使用new
命令,否則會丟擲乙個錯誤。
(3)不可以使用arguments
物件,該物件在函式體內不存在。如果要用,可以用rest引數代替。
(4)不可以使用yield
命令,因此箭頭函式不能用作generator函式。
繫結this
遞迴函式
//斐波拉切數列 也是遞迴的一種 傳的值過大,容易造成堆疊溢位 記憶體洩漏
function
fibonacci (n) ;
return fibonacci(n - 1) + fibonacci(n - 2);
}fibonacci(10); //
89
// 尾調遞迴function factorial(n, total = 1)
factorial(5) //
120
只要在嚴格模式下,才能使尾調遞迴函式優化,(由於遞迴就是使用棧太多,造成溢位,想要優化,就只能減少棧的使用,故使用迴圈來進行遞迴)
額外說點:造成記憶體洩漏的原因:1)使用了遞迴; 2)使用了小數點,如:0.0000000001;3)settimeout第乙個引數是字串
//優化尾調遞迴函式
function
trampoline(f)
returnf;}
function
sum(x, y)
else
}trampoline(sum(1, 100000))
//100001
//使用蹦床函式也可以優化尾調函式
function
tco(f)
active = false
;
return
value;}};
}var sum = tco(function
(x, y)
else
});sum(1, 100000)
//100001
原理:tco
函式是尾遞迴優化的實現,它的奧妙就在於狀態變數active
。預設情況下,這個變數是不啟用的。一旦進入尾遞迴優化的過程,這個變數就啟用了。然後,每一輪遞迴sum
返回的都是undefined
,所以就避免了遞迴執行;而accumulated
陣列存放每一輪sum
執行的引數,總是有值的,這就保證了accumulator
函式內部的while
迴圈總是會執行。這樣就很巧妙地將「遞迴」改成了「迴圈」,而後一輪的引數會取代前一輪的引數,保證了呼叫棧只有一層。
額外說點:
es6 模組之中,頂層的this
指向undefined
,即不應該在頂層**使用this
。
import
是靜態執行,所以不能使用表示式和變數,這些只有在執行時才能得到結果的語法結構。
require
是執行時載入模組,import
命令無法取代require
的動態載入功能。
import
和export
命令只能在模組的頂層,不能在**塊之中(比如,在if
**塊之中,或在函式之中)。
es6新特性 ES6新特性(一)
var 1 var宣告的是函式作用域 區域性 但在if for等定義的變數是全域性的 2 var 具有變數提公升,預解析 3 在同乙個作用域下,var可以宣告多次 4 var 宣告的變數會掛載到window上 let1 let不存在變數提公升,在變數使用之前,必須要先宣告 2 let在同一作用域下,...
ES6的新特性
一 let,const與var的區別 1 let,const 不存在變數提公升。2 let,const 在同乙個作用域下不能重複定義相同的變數名稱。3 let,const 有嚴格的作用域,塊級作用域。var 則是函式作用域。4 const 宣告乙個唯讀的常量,一旦定義,常量的值不能改變。5 cons...
ES6新特性須知
1.1es5之前函式想要賦預設值var funes5 function a,b,c 1.2es6開始函式想要賦預設值var funes6 function a 50,b 60,c 70 2.1es5之前字串拼接或者拼接屬性值只能如下var a lbj var b 50 var c name a ye...