ES6的一些数组对象的方法

ES6的一些新特性

ES6

1. 数组结构赋值

 const [a,b]=[1,2]
  console.log(a,b)  //1,2

2. 对象结构赋值

   var obj = {name:'zs,age:18}
       const {name,age}=obj
       console.log(name,age) // 'zs',18

3. 箭头函数
   1. 箭头函数不绑定关键字,箭头函数中的this指向的是函数定义位置的上下文this

      var obj = {name:'mark'}
      function sum() {
      	console.log(this) //obj
      	return ()=>{
      	console.log(this) //obj
      	}
      };
      let res=sum.call(obj)
      res(); // obj
      ```
   

4. 扩展运算符

       //合并数组
       let arr1 =[1,2,3]
       let arr2 = [4,5,6]
       let arr3 = [...arr1,...arr2] //[1,2,3,4,5,6]
       //另一种合并数组
       let arr3= arr1.push(...arr2)
       
       //将伪数组转化成真正的数组
       let divs = document.getElementsByTagName('div')
       const arr=[...divs]
       //2.用Array.from()方法将伪数组转换成数组
       var arrayLike={
       '0':'张三',
       '1':'李四',
       '2':'王五',
       'length':3
       }
       var ary = Array.from(arrayLike)  //

6. Array.from方法

        var arrayLike={
       '0':'1',
       '1':'2',
       'length':2
       }
       //调用Array.from方法可以将伪数组转化成数组 第二参数回调函数可以进行数组遍历运算
       var arr = Array.from(arrayLike,item => item*2)
       console.log(arr)  // [2,4]

7. 数组find方法 查找数组中第一个满足条件的值

       let ary =[{id:1,name:'张三'},{id:2,name:'张三'}];
       
       let arr2 = ary.find(item=>item.id==2);
       console.log(arr2) // {id:2,name:'张三'}
       如果查找不存在输出就是undefined

8. findIndex()方法 用于找出第一个符合条件的数组成员的下标,如果没有就返回-1

       let ary = [1,5,10,15]
       let str = ary.findIndex(item=>item>5)
       console.log(str) //2

9. includes方法 表示某个数组是否包含给定的值,返回布尔值

       let arr1 = [1,2,3]
       arr1.includes(2) // true
       arr1.includes(4)  //false

10. 模板字符串

       let result ={
           name:'张三',
           age:20,
           sex:'男'
       }
       //模板字符串可以换行 嵌入变量 ${变量}
       let html = `<div> 
       	<span>${result.name}</span>
       	<span>${result.age}</span>
       	<span>${result.sex}</span>
       </div>`;

11. String的扩展方法
    • 实例方法: startsWith() 和 endsWith()
    • startsWith():表示参数字符串是否在原字符串的头部,返回布尔值
    • endsWith():表示参数字符串是否在原字符串的尾部,返回布尔值

    let str = "Hello itheima !";
    let s1 = str.startsWith("H");
    console.log(s1); //true
    let s2 = str.endsWith("!");
    console.log(s2); //true

- 字符串 repeat方法 表示将原字符串重复n次 ,返回一个新字符串
      'hello'.repeat(2)  // 'hellohello'

• set数据结构

    利用set数据结构进行数组去重
    const s2= new Set(['a','a','b',''b])
    connsole.log(s2.size)  //2 当数据重复会自动过滤
    const s3 = [...s2]
    console.log(s3)  //['a','b']

• set数据结构 实例方法

      const s1= new Set() 
      //向set结构中添加值用add方法
      s1.add('a').add('b')
      console.log(s1.size) // 2
      
      //从set结构中删除值 delete 返回的是一个布尔值
      const s2 =s1.delete('b')
      console.log(s1) // 1
      console.log(s2) //true
      
      //判断某一个值是否是set数据结构中的成员 使用has
      const s3 = s1.has('a')
      console.log(s3) //true
      
      //清除set数据结构中的所有值
      s1.clear()

• 遍历set 用forEach

      const s5 = new Set(['a','b','c'])
      s5.forEach(item =>{console.log(item)})

• 所有代码执行 :同步> 回调>异步
• 解构赋值
  1.等号两边格式保持一致
  2.解构的属性,必须属于右边的自身属性
  3.可以用等号给默认值 ,如果右边对象本身就有,就按具有的属性,如果没有 则按默认的来
  4.可以给属性取一个别名

     let obj ={
     	name:'heima',
     	age:10,
     	agel:30
     	
     }
     let {name:cName , agel = 20} = obj
     
     console.log(cName,agel)

深拷贝

• 最常用的深拷贝方式

      let obj = {
      	name:'zs',
      	age:18
      }
      
      let newObj = JSON.parse(JSON.strinfy(obj))

let instance = new obj.constructor