es6的一些技巧

2021-08-19 14:08:07 字數 3581 閱讀 3661

1,強制要求引數

es6 有預設引數設定機制 ;允許在入參的括號裡給引數賦予預設值 ;防止函式在呼叫時沒有傳參;

我們知道在js函式在入參的時候是入幾個都可以的; 

這就給了我們發揮的空間,我們來強制要求引數必須有 ,否則就報錯;

const required  = ()=>

const add=(a=required(),b=required())

=>a+b;

add(1,2);

add(1)

這樣的話,如果少引數,那麼控制台就會uncaught error: missing parameter;達到強制輸入引數的目的;

2,set 方法的妙用

(1)使用set來實現陣列去重;

我們都知道set只儲存唯一值;

所以 這樣 const arr=[1,2,3,3];

const arr1 =array.from(new set(arr));

或者這樣

const

arr=[ 1,

2,3,

3];const

arr1

=[ ...new

set(

arr)];

使用array.from 或者 ...都可以實現set 到 陣列的轉換;

(2) 基於 以上去重操作那麼我們就可以實現一些東西了;

array.from 或者 ...都已經 使得set變為陣列了 ,那麼就可以使用一些原生的api 例如 foreach,some ,every,filter,map,reduce

陣列方法;

例如const

arr=[ 1,

2,3,

3,4,

4,5,

6];const

arr1

=[ ...new

set(

arr)].

filter((item,index)

=>

item

>

3);

3,解構賦值

3.1 物件解構

3.1.1刪除物件上不需要的屬性

例如:const

obj=;

const=

obj;

這樣我們 就可以拿到除了name,age的其他的屬性,變相的刪除了這倆屬性; 其他的屬性放在otherattrbute物件中;

以備後用;

3.1.2 合併物件;

利用...運算子來做結構;

例如:const

obj1=;

const

obj2=;

const

obj3=;

const

newobj

=; //

這樣就實現了物件的結構合併,注意:相同key名 後面的物件覆蓋前面;

3.1.3 在函式的引數中解構 入參的物件;

例如 :

const

xiaohong=

} const

getsomeattrbute

=(,someattrbute})

=>

getsomeattrbute(

xiaohong);

這樣的話就可以直接拿到 該物件的某些個屬性;

3.2 陣列解構

3.2.1  數值交換

例如:let

a=1;

let

b=2;

[ b,

a]=[

a,b]

console.

log(

a);//2

console.

log(

b);//1

這樣就實現了值的互換;

3.2.2 接收函式返回的多個結果;

async

function

getfullpost();

cosnt [

post,

comments]

=getfullpost();

這樣getfullpost()函式呼叫會得到乙個陣列 ,我們就可以通過解構賦值直接拿到每個返回結果的資料,方便處理;

4 關於reduce的一些妙用 

首先宣告 這是關於es5的方法 ,只是歸併到這個文章了;

const

arr=[ 1,

2,3,

4,5];

const

result

=arr.

reduce((a,b)

=>

a+b);

console.

log(

result); //15

首先來說一下這個api的簡單用法; 實現陣列中的每一項相加 ,引數a是初始值

, 或者計算結束後的返回值,b是當前元素; 這是簡單用法 ,前方高能。

4.1.1  使用reduce同時實現map和filter

const

nums

=[ 10,

20,30,

40,50,

60,70];

const

result

=nums.

reduce((a,b)

=>

return

a },)

console.

log(

result);//[60, 80, 100, 120, 140]

這裡後面是空陣列是 可選引數 ,是指a的初始值;

這樣一來實現了map方法,重新返回乙個處理過的新的副本,

二來實現了filter方法實現了過濾;

這樣就可以實現替代map和filter的結果;

4.1.2  統計陣列中相同項的個數;

var

cars

=[ "bwm",

"benz",

"benz",

"tesla",

"bwm",

"toyota"];

var

result

=cars.

reduce((a,b)

=>,{});

console.

log(

result);//

這樣就得到了陣列中每個元素的數量;

es6的一些技巧總結 1

1 物件解構 1 刪除不需要的屬性 let console.log c 2 獲取需要的屬性 let a const getattr b1 3 合併物件let a let b let merger 2 set 1 陣列去重 let arr 1,1,2,2,3,3 let afterarr newset...

es6的一些筆記

new set 用來去重陣列。let arr 1,2,2,3 let set new set arr let newarr array.from set console.log newarr 1,2,3 set類似於陣列,區別在於它所有的成員都是唯一的,不能有重複的值 展開運算子 合併陣列 let ...

總結 es6的一些語法

一 let關鍵字 1.作用 let與var相同,用於宣告乙個變數,2.特點 let在塊作用域內有效 不能重複宣告 不會預處理,不存在提公升 3.應用 迴圈遍歷加監聽 二 const 定義常量,不可以去修改 三 變數的解構賦值 let obj let obj 輸出結果koke 30 let arr 1...