当前位置:   article > 正文

ES6/ES7常用语法记录_前端 es7语法

前端 es7语法

记录比较常用的ES6/ES7语法

一、检测是否为数组

1、instanceof 方法

const arr = new Array() // const arr = []
arr instanceod Array //true
  • 1
  • 2

2、constructor 属性

返回对象相对应的构造函数。

const arr = new Array()
arr.constructor === Array //true
  • 1
  • 2

3、isArray() 方法

const arr = new Array()
Array.isArray(arr) //true
  • 1
  • 2

二、数组与字符串相互转换

1、数组转字符串:join()

const arr = ["1","2","3"]
const arrToString = arr.join(',')
console.log(arrToString)	//1,2,3
  • 1
  • 2
  • 3

2、字符串转数组:split()

const str = '1,2,3'
const stringToArr = str.split(',')
console.log(stringToArr)	//["1","2","3"]
  • 1
  • 2
  • 3

三、数组反转

reverse()对原数组操作并返回经过处理后的原数组

const arr = ["1","2","3"]
const arrReverse = arr.reverse()
console.log(arrReverse)	//["3","2","1"]
  • 1
  • 2
  • 3

四、数组去重

[...new Set(arr)]

const arr = ["1","2","3","1"]
const newArr = [...new Set(arr)]
console.log(newArr)	//["2","3","1"]
  • 1
  • 2
  • 3

五、数组排序

arr.sort():对原数组操作并返回经过处理后的原数组

sort()方法用于对数组的元素进行排序,并返回原数组。如果不带参数,按照字符串UniCode码的顺序进行排序

//不带参数
const arr = ["a","c","b","d"]
const newArr = arr.sort()
console.log(newArr)	//["a", "b", "c", "d"]

//带参数
const arr2 = [1,3,2,0]
const newArr2 = arr.sort((a,b)=>{
    return a-b  //从小到大
})
const newArr3 = arr.sort((a,b)=>{
    return b-a //从大到小
})
console.log(newArr2) //[0,1,2,3]
console.log(newArr3) //[3,2,1,0]
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15

六、元素在数组中的位置

1、find():找出第一个符合条件的数组元素,满足true即返回,不再执行

[1,-2,-3].find(v=>v<0)
//-2
  • 1
  • 2

2、includes():是否包含指定的值,同样适用于字符串

[1,-2,-3].includes(1)
//true
  • 1
  • 2

3、startsWith():是否以指定的值开头

'hellow'.startsWith('he')
//true
  • 1
  • 2

4、endsWith():是否以指定的值结尾

'hellow'.endsWith('ow')
//true
  • 1
  • 2

七、数组的遍历与迭代

1、arr.filter():返回符合条件的新数组

const arr = [1,2,3,4,5]
const filterArr = arr.filter(v=>v>3)
console.log(filterArr)   //[4,5]
  • 1
  • 2
  • 3

2、arr.every():判断所有元素是否满足条件,只有全部为true才返回true

const arr = [1,2,3,4,5]
const everyArr = arr.every(v=>v>0)
console.log(everyArr)   //true
  • 1
  • 2
  • 3

3、arr.some():判断是否存在元素满足条件,只要有一个为true就返回true

const arr = [1,2,3,4,5]
const someArr = arr.some(v=>v>4)
console.log(someArr)   //true
  • 1
  • 2
  • 3

4、arr.map():循环数组,每个元素经过回调函数操作后的返回值组成一个新的数组返回

const arr = [1,2,3,4,5]
const mapArr = arr.map(v=>v+1)
console.log(mapArr)   //[2,3,4,5,6]
  • 1
  • 2
  • 3

5、array.forEach(callbak)为数组的每个元素执行对应的方法。

let a = [1, 2, 3, 4, 5];

let b = [];
a.forEach((item) => {
    b.push(item + 1);
});
console.log(b); // [2,3,4,5,6]
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

八、扩展运算符

...:将一个数组转为用逗号分隔的参数序列。

console.log(...[1,2,3]);  // 1 2 3
  • 1

持续记录…

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/673876
推荐阅读
相关标签
  

闽ICP备14008679号