ES6 新知識
...運算子
將一個陣列轉為用逗號分隔的引數序列。
function push(array, ...items) {
array.push(...items);
}
function add(x, y) {
return x + y;
}
var numbers = [4, 38];
add(...numbers) ;
可變引數個數的函式呼叫
function push(array, ...items) {
array.push(...items);
}
function add(...vals){
let sum=0;
for(let i=0;i<vals.length;i++){
sum+=vals[i];
}
return sum;
}
let arr = [1,2,3,4,5,6];
let sum = add(...arr);
console.log(sum); //21
更便捷的陣列合並
let arr1 = [1,2];
let arr2 = [5,6];
let newArr = [20];
//es5 舊寫法
newArr = newArr.concat(arr1).concat(arr2); //[20,1,2,5,6]
console.log(newArr);
//es6 使用擴充套件運算子
newArr = [20,...arr1,...arr2]; //[20,1,2,5,6]
console.log(newArr);
替代es5的apply方法
// ES5 的寫法
function f(x, y, z) {
// ...
}
var args = [0, 1, 2];
f.apply(null, args);
// ES6 的寫法
function f(x, y, z) {
// ...
}
var args = [0, 1, 2];
f(...args);
求最大值Math.max()
// ES5 的寫法
Math.max.apply(null, [14, 3, 77])
// ES6 的寫法
Math.max(...[14, 3, 77])
// 等同於
Math.max(14, 3, 77);
透過push函式,將一個陣列新增到另一個陣列的尾部
// ES5 的寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
// ES6 的寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2);
新建Date型別
// ES5
new (Date.bind.apply(Date, [null, 2015, 1, 1]))
// ES6
new Date(...[2015, 1, 1]);
與解構賦值結合,生成新陣列
// ES5
a = list[0], rest = list.slice(1)
// ES6
[a, ...rest] = list
下面是另外一些例子。
const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest // [2, 3, 4, 5]
const [first, ...rest] = [];
first // undefined
rest // []:
const [first, ...rest] = ["foo"];
first // "foo"
rest // []
將字串轉為真正的陣列
[...'hello']
// [ "h", "e", "l", "l", "o" ]
將實現了 Iterator 介面的物件轉為陣列
var nodeList = document.querySelectorAll('div');
var array = [...nodeList];
©著作權歸作者所有:來自51CTO部落格作者sendoffice的原創作品,如需轉載,請註明出處,否則將追究法律責任
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/4550/viewspace-2819082/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- es6新知識
- ES6的這些新知識你記住了沒?
- JavaScript的ES6有哪些新知識需要我們去學習JavaScript
- 新知識:jQuery語法基礎與操作jQuery
- 新知識點:Python裡面有幾個有趣的函式Python函式
- 什麼?神經網路還能創造新知識?神經網路
- Get職場新知識:做分析,用大資料分析工具大資料
- es6基礎知識
- es6基本知識整合
- ES6知識點概述
- ES6 知識整理一(es6快速入門)
- ES6 常用知識彙總
- ES6核心知識總結
- 風變程式設計Python課程打破傳統,用新方法學新知識程式設計Python
- 最新知識圖譜論文清單,就算看不懂也會忍不住收藏
- JS知識點:ES6 中常見的知識點JS
- 全新知識付費分銷系統原始碼:能否開啟變現新時代?原始碼
- 新知識get,vue3是如何實現在style中使用響應式變數?Vue變數
- node識別es6的 import/exportImportExport
- 科技新知 | 深度學習的前世今生深度學習
- ES6部分常用知識整理
- ES6新手學習知識點整理
- ES6常用知識點總結(上)
- ES6常用知識點總結(下)
- 有關Es6知識的小結
- react 之 ES6建立元件的知識React元件
- ReactNative開發必備ES6知識React
- ES6的Promise知識點總結Promise
- Node.js 靜態伺服器新知Node.js伺服器
- 基礎知識梳理~ES6 解構賦值賦值
- 面試官:你瞭解es6的知識嗎?面試
- 13篇文章,教你學會ES6知識點
- 新知同享 | Web 開發效能提升,最佳化體驗Web
- 好程式設計師JavaScript分享ES6相關知識程式設計師JavaScript
- 近一萬字的ES6語法知識點補充
- ChatGPT王炸更新!能聯網獲取新知識,可與5000+個應用互動,網友:太瘋狂了ChatGPT
- 【工業機器人】工業機器人技術最新知識大全;工業機器人驅動與控制系統機器人
- ES6面試、複習乾貨知識點彙總(全)面試