ES6常用方法

1、includes

test_includes() {
  const str = 'abcdefg'
  const arr = ['abc', 'cde', 'de', 'efg']
  let result = null
  // ***********************************
  // 字符串str中是否包含字符串de
  result = str.includes('de')
  // true
  console.log(result)
  // ***********************************
  // 字符串str从索引3开始是否包含字符串de
  result = str.includes('de', 3)
  // true
  console.log(result)
  // ***********************************
  // 数组arr中是否包含元素efg
  result = arr.includes('efg')
  // true
  console.log(result)
  // ***********************************
  // 数组arr从索引1开始是否包含元素cde
  result = arr.includes('cde', 1)
  // true
  console.log(result)
}

 

 

2、startsWith

test_startsWith() {
  const str = 'abcdefg'
  let result = null
  // ***********************************
  // 字符串str是否以abc开头
  result = str.startsWith('abc')
  // true
  console.log(result)
  // ***********************************
  // 字符串str从索引2开始是否以cde开头
  result = str.startsWith('cde', 2)
  // true
  console.log(result)
}

 

 

3、endsWith

test_endsWith() {
  const str = 'abcdefghijklmn'
  let result = null
  // 字符串str是否以mn结尾
  result = str.endsWith('mn')
  // true
  console.log(result)
  // ***********************************
  // 字符串的前5个元素是否以de结尾
  result = str.endsWith('de', 5)
  // true
  console.log(result)
}

 

4、repeat

test_repeat() {
  const str = 'abc'
  let result = null
  // 参数为0时输出空串
  result = str.repeat(0)
  // true
  console.log(result === '')
  // ***********************************
  // 重复1次str
  result = str.repeat(1)
  // abc
  console.log(result)
  // ***********************************
  // 重复2次str
  result = str.repeat(2)
  // abcabc
  console.log(result)
}

 

5、spread

// ...运算符
test_spread() {
  const arr1 = [1, 2, 3, 4, 5, 6]
  // 复制数组arr1得到新数组arr2
  const arr2 = [...arr1]
  // [1, 2, 3, 4, 5, 6]
  console.log(arr2)
  // ***********************************
  const arr3 = ['a', 'b']
  const arr4 = ['c']
  const arr5 = ['d', 'e']
  // 合并arr3、arr4、arr5三个数组得到新数组arr6
  const arr6 = [...arr3, ...arr4, ...arr5]
  // ["a", "b", "c", "d", "e"]
  console.log(arr6)
  // ***********************************
  // 与解构赋值结合
  const [temp, ...arr7] = [100, 'a', 'b', 'c']
  // 100
  console.log(temp)
  // ["a", "b", "c"]
  console.log(arr7)
  // ***********************************
  // 将字符串转为真正的数组
  const arr9 = [...'hello']
  // ["h", "e", "l", "l", "o"]
  console.log(arr9)
}

5.1、spread运算符复制对象数组时,复制前后数组内元素对应地址没变

test_spread2() {
  const arr1 = ['a', 'b', 'c', 'd']
  const arr2 = [...arr1]
  // false
  console.log(arr1 === arr2)
  arr2[0] = 'A'
  // ["a", "b", "c", "d"]
  console.log(arr1)
  // ["A", "b", "c", "d"]
  console.log(arr2)
  // ***********************************
  // 若数组元素是对象,那么复制后元素的地址没变
  const arr3 = [{ name: 'name1' }, { name: 'name2' }]
  const arr4 = [...arr3]
  // false
  console.log(arr3 === arr4)
  arr4[0].name = 'NAME1'
  // 0: {name: "NAME1"}
  // 1: {name: "name2"}
  console.log(arr3)
  // 0: {name: "NAME1"}
  // 1: {name: "name2"}
  console.log(arr4)
}

 

6、Array.of

'test_Array.of'() {
  // 将一组值转换为数组
  const arr1 = Array.of(1, 2, 3)
  // [1, 2, 3]
  console.log(arr1)
  // ***********************************
  const arr2 = Array.of(1, 'a', 'b')
  // [1, "a", "b"]
  console.log(arr2)
}

7、fill

test_fill() {
  // fill()为数组实例的方法
  const arr1 = ['a', 'b', 'c']
  // 将数组arr1中的每个元素替换成100
  arr1.fill(100)
  // 数组arr1的值变为[100, 100, 100]
  console.log(arr1)
  // ***********************************
  const arr2 = ['a', 'b', 'c', 'd']
  // 从数组元素索引1开始将每个元素替换为ABC
  arr2.fill('ABC', 1)
  // 数组arr2变为["a", "ABC", "ABC", "ABC"]
  console.log(arr2)
  // ***********************************
  const arr3 = ['A', 'B', 'c', 'd', 'E']
  // 从数组元素索引1开始到索引3(不包含3)结束,将索引区间的元素都替换为Q
  arr3.fill('Q', 1, 3)
  // 数组arr3变为["A", "Q", "Q", "d", "E"]
  console.log(arr3)
}

8、keys

test_keys() {
  // keys数组实例的方法
  const arr1 = ['a', 'b', 'c', 'd']
  // 对键名的遍历,这里是对数组的索引遍历
  for (const key of arr1.keys()) {
    // 依次输出0 1 2 3
    console.log(key)
  }
}

9、values

test_values() {
  // values为数组实例的方法
  const arr1 = ['a', 'b', 'c', 'd']
  // 对数组元素进行遍历
  for (const val of arr1.values()) {
    // 依次输出a b c d
    console.log(val)
  }
}

10、entries

test_entries() {
  // entries为数组实例的方法
  const arr1 = ['a', 'b', 'c', 'd']
  // 对数组的键值对遍历
  for (const [key, val] of arr1.entries()) {
    // 依次输出0:a 1:b 2:c 3:d
    console.log(key + ':' + val)
  }
}

11、set

test_set() {
  // Set不允许元素重复,会自动去重复
  const set1 = new Set([1, 2, 2, 3, 3, 4, 5])
  // 5
  console.log(set1.size)
  // 将set1转换为数组
  const arr1 = [...set1]
  // [1, 2, 3, 4, 5]
  console.log(arr1)
  // ***********************************
  const arr2 = [1, 2, 2, 3, 3, 4, 5]
  // 对数组arr2去重复后返回一个新的数组
  const arr3 = [...new Set(arr2)]
  // [1, 2, 3, 4, 5]
  console.log(arr3)
}

 

posted @ 2020-09-20 10:17  牛牛的自留地  阅读(123)  评论(0编辑  收藏  举报