適用於小程序的 ES6

一、codePointAt

JavaScript內部,字符以UTF-16的格式儲存,每個字符固定爲2個字節。對於那些需要4個字節儲存的字符(Unicode碼點大於0xFFFF的字符),JavaScript會認爲它們是兩個字符。

ES6新增了完全支持UTF-16的方法codePointAt(),該方法接受編碼單元的位置而非字符位置作爲參數,返回與字符串中給定位置對應的碼位,即一個整數值

var text = "𠮷a" ;

console.log(text.charCodeAt(0)); // 55362
console.log(text.charCodeAt(1)); // 57271
console.log(text.charCodeAt(2)); // 97

console.log(text.codePointAt(0)); // 134071
console.log(text.codePointAt(1)); // 57271
console.log(text.codePointAt(2)); // 97  

二、includes

  1. indexOf用來查找某個元素的位置,如果不存在就返回-1,但是不能判斷是否有NaN的元素。

  2. Array.includes()函數判斷是否包含某一元素,返回 true / false,不能定位元素,但是能判斷 NaN。

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', NaN]
console.log('%s', arr1.indexOf(NaN)) // -1
console.log(arr1.includes('c')) // true
console.log(arr1.includes('z')) // false
console.log(arr1.includes(NaN))  // true  
/在此我向大家推薦一個前端全棧開發交流圈:582735936  突破技術瓶頸,提升思維能力

三、startsWith

  1. 確定字符串是否以指定字符串的字符開頭,返回 true/false。注意:區分大小寫!

  2. 接受兩個參數:

第一個參數,要在此字符串開頭搜索的字符;

第二個參數是指定從字符串開始的位置,默認從零開始

四、endsWith

  1. 從字符串的末尾開始查找

五、repeat

  1. 返回一個新字符串,表示將原字符串重複n次
let str1='a';
let str2=str1.repeat(3);
console.log(str2)//aaa  

六、String.fromCodePoint

七、copyWithin

  1. 用於操作當前數組自身,用來把某些位置的元素複製並覆蓋到其他位置上去。

  2. 該函數有三個參數:

target:目的起始位置;

start:複製源的起始位置,可以省略,可以是負數;

end:複製源的結束位置,可以省略,可以是負數,實際結束位置是end-1。

const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr1.copyWithin(1, 3, 6)
console.log('%s', JSON.stringify(arr1)) // [1,4,5,6,5,6,7,8,9,10,11]
  

目標的位置不夠的,能覆蓋多少就覆蓋多少

const arr2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr2.copyWithin(3)
console.log('%s', JSON.stringify(arr2)) // [1,2,3,1,2,3,4,5,6,7,8]  

start和end都可以是負數,負數表示從右邊數過來第幾個

const arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr3.copyWithin(3, -3, -2)
console.log(JSON.stringify(arr3)) // [1,2,3,9,5,6,7,8,9,10,11]  

八、find

  1. 查找目標元素,找到就返回該元素,找不到返回undefined
const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
var ret1 = arr1.find((value, index, arr) => { 
return value > 4
})
var ret2 = arr1.find((value, index, arr) => { 
return value > 14
})
console.log('%s', ret1) // 5
console.log('%s', ret2) // undefined  
/在此我向大家推薦一個前端全棧開發交流圈:582735936  突破技術瓶頸,提升思維能力

九、findIndex

  1. 查找目標元素,找到就返回元素的位置,找不到就返回-1
var ret3 = arr1.findIndex((value, index, arr) => { 
return value > 4
}) 
var ret4 = arr1.findIndex((value, index, arr) => { 
return value > 14
})
console.log('%s', ret3) // 4
console.log('%s', ret4) // -1  

十、fill

  1. 使用制定的元素填充數組

2. 參數:

value:填充值。

start:填充起始位置,可以省略。

end:填充結束位置,可以省略,實際結束位置是end-1。

const arr1 = [1, 2, 3, 4, 5]
arr1.fill(7)
console.log(arr1) // [7, 7, 7, 7, 7]  

十一、entries(),keys()和values() —— 用於遍歷數組

  1. 區別是keys()是對鍵名的遍歷、values()是對鍵值的遍歷,entries()是對鍵值對的遍歷
for (let index of ['a', 'b'].keys()) {
 console.log(index) // 0 1
}  

十二、Array.from

  1. 將對象轉換成數組

2. 條件:

1)部署了Iterator接口的對象,比如:Set,Map,Array

2)類數組對象,就是一個對象必須有length屬性,沒有length,轉出來的就是空數組。

轉換map

轉換set

轉換字符串

Array.from('hello world') // ["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]  
Array.from('\u767d\u8272\u7684\u6d77') // ["白", "色", "的", "海"]  

類數組對象

Array.from({
  0: '0',
  1: '1',
  3: '3',
  length:4
}) 
// ["0", "1", undefined, "3"]  
/在此我向大家推薦一個前端全棧開發交流圈:582735936  突破技術瓶頸,提升思維能力
Array.from({
  0: 0,
  1: 1
})
// []  

3. 參數:

1)被轉換的的對象。

2)map函數。

3)map函數中this指向的對象。

let diObj = {
  handle: function(n){
    return n + 2
  }
}
Array.from(
  [1, 2, 3, 4, 5], 
  function (x){
    return this.handle(x)
  }, 
  diObj
) // [3, 4, 5, 6, 7]  

十三、Array.of

  1. new Array()構造數組的時候,是有二意性的

構造時,傳一個參數,表示生成多大的數組。

構造時,傳多個參數,每個參數都是數組的一個元素。

  1. 將一個或多個值轉換成數組 === new Array() 傳多個參數 的情況

結語

感謝您的觀看,如有不足之處,歡迎批評指正。
獲取資料👈👈👈
本次給大家推薦一個免費的學習羣,裏面概括移動應用網站開發,css,html,webpack,vue node angular以及面試資源等。
對web開發技術感興趣的同學,歡迎加入Q羣:👉👉👉582735936 👈👈👈,不管你是小白還是大牛我都歡迎,還有大牛整理的一套高效率學習路線和教程與您免費分享,同時每天更新視頻資料。
最後,祝大家早日學有所成,拿到滿意offer,快速升職加薪,走上人生巔峯。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章