ES6基础语法

 //1.继承父类中的方法
    class Father{
        money(){
            console.log(100);
           }
        }
        class Son extends Father{
        }
        var son=new Son();
        son.money();
 //2.super关键字在子类中传递值给父类
    class Father{
        constructor(x,y){
            this.x=x;
            this.y=y;
        }
        sum(){
            console.log(this.x+this.y);
        }
    }
    class Son extends Father{
        constructor(a,b){
            super(a,b);
        }
    }
    var son=new Son(20,30);
    son.sum()
//3.super继承
class Father{
   constructor(){
        }
        say(){
            console.log('我是爸爸');
        }
    }
    class Son extends Father{
        say(){
           super.say();
        }
    } 
    var son=new Son();
    son.say();
 //4.子类的super必须在子类this的前面
 class Father{
        constructor(x,y){
            this.x=x;
            this.y=y;
        }
        sum(a){
            console.log(this.x+this.y+a);
            
        }
    }
    class Son extends Father{
        constructor(x,y){
            super(x,y);
            this.x=x;
            this.y=y;
        }
        sum1(){
            console.log(this.x+this.y);
        }
    }
    var son=new Son(1,2);
    son.sum();
    son.sum1();

对象解构

let arr=[1,2,3,45];
         let[a,b,c,d]=arr;
         console.log(a);
         console.log(b);
         console.log(c);
         console.log(d);
         //方法一
         let person={name:'ldh',age:18};
         let{name,age}=person;
         console.log(name);//ldh
         console.log(age);//18
         //方法二
         let {name:myname,age:myage}=person;
         console.log(myname);//ldh
         console.log(myage);//18

箭头函数

function sum(num1,num2){
             return num+num2;
         };
         //当只有一个返回值的时候可以省略大括号
         const sum1=(num1,num2) => num1+num2
         //如果形参只有一个可以省略小括号
         const fn=a=> alert(a);
         fn(6) //6
         //箭头函数不绑定this箭头函数没有自己的this关键字 如果箭头函数中使用this this关键字将指向箭头函数定义的位置的this
         function fn1(){
             console.log(this);
             return function(){
                 console.log(this);
             }
         }
         const obj={name:'zhangsan'};
         const resFn=fn1.call(obj);
         resFn(); //this指向的是window
         function fn1(){
             console.log(this);
             return ()=>{
                 console.log(this);
             }
         }
         const obj={name:'zhangsan'};
         const resFn=fn1.call(obj);
         resFn(); //this指向obj
         //eg列子
		 var age=100;
         var obj={
             age:20,
             say:()=> console.log(this.age)
         }
         obj.say(); //100 箭头函数指向的是全局作用域上面因为指定了this

剩余参数及Array扩展方法

const sum=(...args)=>{
           let total=0;
           args.forEach(item=>total+=item
           );
           return total;
       }
       console.log(sum(10,20,30));
       function sum1(...arg){
           console.log(arg);
       }
       sum1(10,30,50,function(){
           console.log(666);
           
       });
       //剩余参数和解构配合使用
       let arr1=['张三','李氏','王五'];
       let[s1,...s2]=arr1;
       console.log(s1);//张三
       console.log(s2);//["李氏", "王五"]
       //扩展运算符
       //(可以将数组拆分成以逗号分隔的参数序列)
       let ary=['a','b','c'];
       console.log(...ary);//a b c
       console.log('a','b','c');//a b c
       //(应用于数组合并)方法一
       let arr1=[1,2,3];
       let arr2=[4,5,6];
       let arr3=[...arr1,...arr2];
       console.log(arr3);//[1, 2, 3, 4, 5, 6]
      //(应用于数组合并)方法二
       let arr1=[1,2,3];
       let arr2=[4,5,6];
       arr1.push(...arr2);
       console.log(arr1);//[1, 2, 3, 4, 5, 6]
     //展开语法把伪数组转化为数组
     var oDiv=document.getElementsByClassName('di');
     var art=[...oDiv];
     //构造函数方法 Array.from();对象转化为数组
     let arrLike={
         '0':'ldh',
         '1':18,
         'length':2
     };
     let newarrLike=Array.from(arrLike);
     console.log(newarrLike);
     //Array.find();
     var fid=[{
         id:1,
         name:'张三'
     },{
         id:2,
         name:'李四'
     }];
     let target=fid.find((item)=>{
        return item.id==2;
     })
     console.log(target);
     //Array.findindex() 查找索引
     let ary=[10,20,30];
     let index=ary.findIndex(item=>{
         item>15
     });
     console.log(index);//1
     //Array.includes 查看数组是否包含要查的值返回值为true flase
    let result= ['a','b','c'].includes('a');
    console.log(result);//true

模板字符串

let name=`张三`;
let sayHello=`我的名字是${name}`;
let name=`张三`;
        let sayHello=`我的名字是${name}`;
        var a={
            name:'ldh',
            age:18
        };
        var html=`
        <p>${a.name}</p>
        <p>${a.age}</p>
        `
//构造函数set方法见最后

补充浅拷贝

var obj={
            id:1,
            name:'andy',
            msg:{
                id:01,
                name:'ldh'
            }
        };
        var o={};
        for(var key in obj){


          o[key]=obj[key];
            
        }
        console.log(o);
        //浅拷贝直接调用方法
        var obj={
            id:1,
            name:'andy',
            msg:{
                id:01,
                name:'ldh'
            }
        };
        var o={};
        Object.assign(o,obj);
        console.log(o);

深拷贝

var obj={
            id:1,
            name:'andy',
            msg:{
                id:01,
                name:'ldh'
            },
            arr:[1,2,3]
        };
        var o={};
        function deepCopy(newCopy,obj){
            for(var key in obj){
                var item=obj[key];
                if(item instanceof Array){
                    newCopy[item]=[];
                    deepCopy(newCopy[key],item);
                }else if(item instanceof Object){
                    newCopy[item]={};
                    deepCopy(newCopy[key],item);
                }else{
                    newCopy[k]=item;
                }
            }
        }
        deepCopy(o,obj)
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值