專案中常用的ES6語法總結

2021-09-09 05:34:16 字數 3440 閱讀 6934

fill() : 陣列填充

array.fill(value): 會對陣列填充陣列成員, 填充長度等於陣列長度

array.fill(value, start, end): 可以使用指定的元素填充陣列

它接受三個引數:

const filldata = (data) =>

return data;

}

['a', 'b', 'c'].fill(7) // [7, 7, 7]

new array(3).fill(7) // [7, 7, 7]

['a', 'b', 'c'].fill(7, 1, 2) // ['a', 7, 'c']

includes():陣列包含

array.includes()方法用來判斷乙個陣列是否包含乙個指定的值,根據情況,如果包含則返回 true,否則返回false。對nan一樣有效。

const arr1 = ['a', 'b', 'c', 'd', nan]

console.log('%s', arr1.includes('c')) //true

console.log('%s', arr1.includes('z')) //false

console.log('%s', arr1.includes(nan)) //true

from():陣列轉換

array.from 可以接受三個引數:array.from(arraylike[, mapfn[, thisarg]])

array.from([1, 2, 3], (x) => x * x) // [1, 4, 9]

// 等同於

array.from([1,2,3].map(x => x * x))

let obj= 

}console.log(array.from(

[1, 2, 3],

function (x),

obj)

) // [1, 4, 9]

copywithin():陣列覆蓋

array.prototype.copywithin(target, start = 0, end = this.length)

它接受三個引數:

console.log([1, 2, 3, 4, 5].copywithin(0, 1, 2));  // [2,2,3,4,5]

console.log([1, 2, 3, 4, 5].copywithin(0, 1, 3)); // [2,3,3,4,5]

console.log([1, 2, 3, 4, 5].copywithin(0, 1, 4)); // [2,3,4,4,5]

const s = 'zfpx';

s.startswith('z') // true

s.endswith('x') // true

s.includes('p') // true

第二個引數,表示開始搜尋的位置。(起始值為0)

const s = 'zfpx';

console.log(s.startswith('p',2)); // true

console.log(s.endswith('f',2)); // true

console.log(s.includes('f',2)); // false

注意:endswith的行為與其他兩個方法有所不同,它針對前n個字元。而其他兩個方法針對從第n個位置直到字串結束

console.log("abc".repeat(3))     //abcabcabc

console.log("abc".repeat("3")) //abcabcabc

模版字串,用`(反引號)標識,用${}將變數括起來。

"he is"+person.name+""+"and we wish to know his"+person.age+".that is all" );

等價於 `he is$and we wish to know his$.that is all`);

可以定義變數:

const name = 'lux'

console.log(`hello $`) //hello lux

inputs=>output

比如之前寫乙個函式:

function()
寫成箭頭函式表示:

() => console.log('hello')
箭頭函式根本沒有自己的this,導致內部的this就是外層**塊的this。 正是因為它沒有this,從而避免了this指向的問題。

const person = ,1000); //在瀏覽器執行的話this指向 window

// settimeout(() => console.log(this),1000);//在瀏覽器執行的話this指向 person }}

person.getname();

解構賦值的作用是可以快速取得陣列或物件當中的元素或屬性,而無需使用arr[x]或者obj[key]等傳統方式進行賦值。

const color = ['red', 'blue'];

//傳統賦值方式

var first = color[0];

var second = color[1];

//解構賦值方式

const [first, second] = color;

console.log(first); //'red'

console.log(second); //'blue'

const people = 

}const = people;

console.log(name); //lux

const = people;

console.log(`$--$`) ;//lux--20

const } = user;

console.log(degree); // masters

專案中常用的ES6

看 及注釋就懂了 把es6 es2015 轉換為es5 解構賦值 let dessert,drink,fruit breakfast const breakfast let breakfast 字串 陣列展開符 利用 array 的 concat 實現 let food rice breakfast...

常用es6語法總結

一.let var,const var沒有塊級作用域,定義後在當前閉包中都可以訪問,如果變數名重複,就會覆蓋前面定義的變數,並且也有可能被其他人更改。for var i 0 i 3 i 0 結果會列印3次3,原因是var 沒有塊級作用域,而let有自己的塊級作用域,所以不會出現這種情況。使用 let...

常用ES6基礎語法總結

用自己易於理解的語言總結的,歡迎各位大佬指點 1 用來宣告塊級作用域 let宣告的變數只在其塊級作用域內有效,而var通常在函式作用域或全域性作用域內有效塊級作用域 指用花括號包裹起來形成的語句塊,如if for while迴圈語句等。if true console.log a a is not d...