ES6學習總結之解構賦值及字串模板

2021-08-16 18:43:32 字數 2137 閱讀 3245

1.將右邊資料匯入左邊,相當於給左邊資料起的別名

例1:let [a,b,c] = [12,5,6]

console.log(a,b,c); //12,5,6

注意:左右兩邊,解構格式保持一致

let [a,[b,c]] = [12,[5,6]];

2.解構json

例2:let json=

let = json;

console.log(name,age,job) //'abc' 18 'aa'

let = json; //j是job的別名

console.log(name,age,j) //'abc' 18 'aa'

3.在解構時可以給預設值

例3:let [a,b,c]=['1',『2』]; console.log(a,b,c) //1 2 undefined

let [a,b,c=「暫無資料」]=['1',『2』] console.log(a,b,c) //1 2 暫無資料

let [a,b,c]=['1',『2』,null]; console.log(a,b,c) //1 2 null

let [a,b,c='暫無資料']=['1',『2』,

null]; console.log(a,b,c) //1 2 null null表示有值

4.交換兩個數的位置

例4:let a=14;

let b=4;

[a,b]=[b,a];

console.log(a,b); //4 14

5.小應用:函式的返回值可以直接解構

例5 :function getpos()

}let = getpos();

console.log(right,left) //10 20

6.小應用:函式傳參也可以解構

例6:function fn()

fn()

字串模板以及新增方法

let name = 'abc'';

let age = 18;

let str = `我叫$,年齡$`;

console.log(str);

1.ajax動態生成時

例項:無字串模板時

字串模板(重點)

var oul=document.getelementbyid('ul1');

for(let i=0;ivar oli = document.createlement('li');

oli.innerhtml =

`$

閱讀人數

$

;oul.qppendchild(0li)`;}}

優點:可以自動換行

可以用${}將本地變數嵌入到字串中

2.字串查詢方法:

(1)str.indexof('串1'):返回串1的位置,反之返回-1

str.includes

('串1'):是否包含串1,有就返回true,反之false

例2:判斷瀏覽器

if(nacigator.useragent.includes('chrome'))else

(2)字串是否以什麼開頭

str.startswith('串2') :檢測str是否以串2開頭,是則返回true,反之返回false

例如:檢測協議

(3)字串是否以什麼結尾

str.startswith('串3') :檢測str是否以串3結尾,是則返回true,反之返回false

例如:檢測檔案字尾名

(4)重複字串:

str.repeat(次數) :返回重複後的str 注:次數不能為負數,否則會報錯

(5)填充字串:

str.padstart(整個字串的長度,填充的東西) :往前填充

例1:console.log('a'.padstart(4,'***')) //***a

例2:let str="a";

let padstr='***';

console.log(str.length+padstr.length,padstr); //***a

str.padend(整個字串的長度,填充的東西) :往後填充

(前端小白,如有錯誤,歡迎指正,在此感激不盡)

ES6 學習 之 解構賦值

es6允許按照一定模式從資料和物件中提取值,對變數進行賦值,這被稱為解構 destructuring let name 張三 age 18,男 let name,age,李四 20,女 name aaa console.log name aaa console.log age 20 console....

es6解構賦值總結

陣列的解構賦值 1.簡單的賦值方式 2.多維陣列解構賦值 3.預設值,只有當右邊對應位置為undefined時候才會選擇預設 null不屬於undefined 4.左右不對等,會相應的對號入座,沒有的以undefined賦值 左邊多於右邊 右邊多餘左邊 物件賦值 1.普通賦值,物件右邊的順序可以打亂...

ES6之 解構賦值

es6允許按照一定模式,從陣列和物件中提取值,對變數進行賦值,這被稱為解構賦值 destructuring 也可以簡稱 解構。下面用 進一步解釋一下什麼叫解構賦值。1.關於給變數賦值,傳統的變數賦值是這樣的 var arr 1,2,3 把陣列的值分別賦給下面的變數 var a arr 0 var b...