es5和es6的函数区别,数组区别

一、函数扩展
    1. rest参数
        es6引入了rest参数(形式:'...args'),主要用于接受函数多余的参数,因此我们就不需要arguments这个对象了,rest参数对应的是一个数组,将多余的参数放进这个数组
        注意:rest参数必须是尾参数,rest参数后边不能再有别的参数,否则会报错
        数组的解构赋值与rest参数配合
    2. 箭头函数
        es6规定允许使用箭头(=>)定义函数
            let f2=b=>console.log(b);
            (b=>console.log(b))(3);//3
        如果箭头函数不需要参数或有多个参数,需要使用一个小括号将参数包裹
        无参:
            let f2=()=>console.log(5);
        很多参数:
            let f4=(a,b,c)=>console.log(a+b+c);
        如果箭头函数函数体内有多条语句,需要使用大括号括起来,并且使用return语句返回内容
        大括号被编译器解析为代码块,所以如果箭头函数只返回一个对象,使用小括号将该对象括起来,就不会被解析为代码块
        箭头函数与变量解构结合使用
        箭头函数可以用于简化回调函数
            let arr=[5,6,7,8].map(x=>x*x);
        rest参数与箭头函数结合
        注意事项:
            1) 函数体内的this对象,指向定义时所在的对象,而不是调用时所在的对象,箭头函数本身没有自己的this,所以箭头函数通过call,bind,apply调用时传的this也是没有效果的
                使用箭头函数作为事件处理函数,this不会指向事件源,而是指向箭头函数定义时所在的对象
                     function Fun3() {
                            this.a=1;
                            this.b=2;
                            box2.οnclick=function () {
                                console.log(this);//box2
                            };
                            box3.οnclick=function () {
                                console.log(this);//Fun3
                            }.bind(this);
                            box4.οnclick=()=>{
                                console.log(this);//Fun3
                            }
                        }
                     var obj2=new Fun3();
            2) 箭头函数不可以作为构造函数,就是说不可以使用new命令调用箭头函数,会报错
            3) 箭头函数中没有arguments对象,不可以被调用,如果需要,使用rest参数
        箭头函数的嵌套:
            let fun=()=>({f:()=>({s:()=>console.log(11)})});
            fun().f().s();//11
二、数组扩展
    1. Array.from()
        用于将两类对象转为数组:类数组对象(array-like-object)和可遍历对象(iterable)
            let divs=document.getElementsByTagName('div');
            var fArr=Array.from(divs);
            var arr2=Array.from(arguments);
        from方法还可以接受第二个参数,作用类似于map方法,用来对每一个元素进行处理,将处理结果放进返回的数组中,映射
            from方法可以将各种值转为数组,还有map功能,只要我们有一个原始的数据结构,就可以先对他进行处理转为一个标准的数组,然后就可以使用数组的各种方法
        from可以将字符串转为数组,然后返回字符串的长度,因为from可以处理各种Unicode编码字符,可以避免js将大于\uffff的Unicode字符算作两个字符的bug
    2. Array.of()
        用于将一组值转换为数组,这个方法的主要目的是弥补数组构造函数Array()的不足之处,因为Array()函数会因为参数个数的不同处理有所差异
        Array() 构造函数只有参数多于2的时候才能创造一个正常的数组
        Array.of() 可以替代array(),Array.of 总是返回参数值组成的新数组,如果没有参数就是一个空数组
    3. copyWithin()
        数组实例对象的方法,在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有的成员),然后返回当前数组,这个方法会修改当前数组
        语法:
            [1,2,3,4].copyWithin(target,start,end);
            target:必须写,从这个位置开始替换
            start:可选,从该位置开始读取,默认是0,负值表示倒着数 ,包括当前位置
            end:可选,到该位置结束,默认等于数组长度,负值表示倒序,不包含该位置
    4. find()和findIndex()
        数组实例的方法find,用于找出第一个符合条件的成员,参数是一个回调函数,所有元素依次执行该回调,直到找到第一个返回值为true的成员,将该成员返回,如果没有找到返回undefined
        find() 方法还可以接收三个参数,依次是当前的值,下标,原数组
        数组实例的方法findIndex(),用法与find一样,返回第一个符合条件的元素的下标,如果没有符合的元素,返回-1
    5. fill()
        使用给定的值,填充一个数组,fill方法用于空数组初始化非常方便,数组中已有的元素全都会抹掉
        fill方法还可以接收第二个和第三个参数,用于指定填充的位置
    6. includes()
        该方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes方法类似
        第二个参数表示开始搜索的起始位置,默认是0,如果是负数表示倒序,如果超出数组长度范围,就会认为从0开始
    7. 数组的空位
        数组的空位指的是数组的某个位置上没有任何值,new Array(3)//[,,];
        注意:空位不是undefined,如果一个位置是undefined,就表示该位置有值
        在es5当中,对空位的处理很不一致,大多数情况会直接跳过忽略空位
            forEach(),filter(),every(),some()等都会跳过空位
            map() 会跳过空位,但是会保留这个值
            join() 和 toString() 会将空位视为undefined,而undefined 和 null 会被处理为空字符串
        但是在es6中,所有的空位都是undefined
        由于空位的处理规则不一致,所以尽量避免出现空位
       

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值