E企盈营销工具技术服务商 热线:4006-838-530

ES6

E企盈直播平台营销卖货系统

1. ES61.1 ES6 定义ES的全程是ECMAScript,它是由ECMA国际标准化定制的一项脚本语言的标准化规范。ES6是ES2016以后版本的统称;为什么使用ES6?1)变量提升特性增加了程序运行时的不可预测性;2)语法过于松散,实现相同的功能,不同的人可能会写出不同的代码 2. let关键字ES6中新增的用于声明变量的关键字1)let声明变量只在所处的块级有效2) 不存在变量提升,所以要提前声明变量;3)暂时性死区,意思:在局部使用let声明的变量在全局作用域上不起作用;注意1:在一个大括号中,使用let关键字声明的变量具有块级作用域,var关键字是不具备这个特点的  if (true) {            var num = 100;            let number = 30;        }        console.log(num);        console.log(number); //报错注意2:防止循环变量变成全局变量for(let i = 0; i 3; i++){      }      console.log(i);//会报错,因为let已将i绑定在for循环里let面试题:let、const、var的区别:结果:0  1结果:2 2 3. const关键字作用:声明常量,常量就是值(内存地址),不能变化的量。具有特点:1)具有块级作用域2)使用const关键字声明的常量必须赋初始值,不然就会报错3)常量赋值后,值不能修改,实际上是值的内存地址不能更改注意:复杂数据类型:数据内部的值可以更改,但是不可以修改内存地址,就是重新赋个新值看下列例子: 4. 解构4.1 解构赋值解构:分解数据结构**赋值:**为变量赋值ES6中允许数组从中提取值,按照对应位置,对变量赋值,对象也可以实现解构。4.1.1 数组解构数组解构允许我们按照一一对应的关系从数组中提取值,然后将值赋给变量。4.1.2 对象解构实质:是属性的匹配写法1:let {变量名1,变量名2····} = 对象;写法2:let {属性:属性值, 属性:属性值····} = 对象4.2 箭头函数ES6中新增的定义函数的方式语法:(放形参)={函数体}为了调用,通常写成:fn = (放形参)={函数体}4.2.1 在箭头函数中,如果函数体中只有一句代码,并且代码的执行结果就是函数的返回值,函数体的大括号可以省略// const sum = (n1, n2) = {        //     return n1 + n2;        // }        // console.log(sum(2, 5));                // 上面代码可以写成:        const sum = (n1, n2) = n1 + n2;        console.log(sum(2, 4));4.2.2 在箭头函数中,如果形参只有一个,形参外侧的小括号也是可以省略的 const fn = v = {            alert(v);        }        fn(‘zyx’);4.2.3 箭头函数this指向箭头函数不绑定this关键字,箭头函数中的this,指向的是函数定义位置的上下文this(意思是:this关键字将指向箭头函数定义位置中的this)箭头函数面试题var obj = {            age: 20,            say: () = {                alert(this.age);            }        }        obj.say();//输出结果为undefined理由:say为箭头函数,它的this指向箭头函数定义的位置,而它定义在windows下,所以this指向windows   ,但windows没有age这个属性,所以它的值就为undefined4.3 剩余参数剩余参数语法允许我们将一个不定数量的参数表示为一个数组注意:箭头函数不能使用arguments语法:function sum(…变量名){}例子: const sum = (…args) = {            let total = 0;            args.forEach(item = total += item)            return total;        };        console.log(sum(10, 20));剩余参数和解构配合使用4.3.1 Array 的扩展方法1)扩展运算符(展开语法)扩展运算符可以将数组或者对象转为用逗号分隔的参数序列 let arr = [‘zyx’, ‘love’, ‘music’];  console.log(…arr); //zyx love music; …将arr分隔掉除了字符外的其他参数  console.log(‘zyx’, ‘love’, ‘music’); //zyx love music2)扩展运算符应用与数组合并方法1:let 变量名 = […合并数组1, …合并数组2];        let arr1 = [‘zyx’, ‘love’, ‘music’];        let arr2 = [‘so’, ‘much’];        let arr = […arr1, …arr2];        console.log(arr);结果:[“zyx”, “love”, “music”, “so”, “much”]方法2:数组名.push(…追加的数组名);3) 将数组或可遍历对象转换为真正的数组方法一:var 定义一个数组名 = […伪数组名]方法二:构造函数方法:Array.from()Array.from() 作用一:将数组或可遍历对象转换为真正的数组Array.from() 作用二: 还可以接收第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组var arrayLike = {            ‘0’: ‘1’,            ‘1’: ‘2’,            ‘length’: 2        }        var ary = Array.from(arrayLike, item = item * 2);        console.log(ary);        //结果:[2, 4]4) find()用于找出第一个符合条件的数组成员,如果没有找到返回undefined      let ary = [{            id: 1,            name: ‘zyx’        }, {            id: 2,            name: ‘music’        }];        let arr = ary.find(item = item.id == 2);        console.log(arr);//结果:{id: 2, name: “music”}5) findIndex()用于找出第一个符合条件的数组成员的位置,如果没有找到返回-1        let ary = [10, 20, 50];        let index = ary.findIndex(item = item 15);        console.log(index); //返回结果16)includes()表示某个数组是否包含给定的值,返回布尔值        let arr = [‘zyx’, ‘a’, ‘b’];        let result = arr.includes(‘zyx’);        console.log(result);4.3.2 String的扩展方法(1). 模板字符串ES6新增的创建字符串的方式,使用反引号定义,tab键上的键let 变量名 = 模板字符串1)模板字符串可以解析变量$(变量名):这样就可以把变量的值输出来        let name = `zyx`;        let sayHello = `Hello, my name is ${name} `;        console.log(sayHello); //Hello, my name is zyx 2)模板字符串中可以换行  let result = {            name: ‘zyx’,            age: 28        };        let html = `             div                 span${result.name}/span                 span${result.age}/span             /div        `;        console.log(html);结果:3)在模板函数中可以调用函数const fn = () = {            return ‘zyx’;        };        let html = `我的名字是${fn()}`;//可以调用函数        console.log(html);//我的名字是zyx(2) startsWith()和endsWith()(3) repeat()repeat( n )方法表示将原字符串重复n次,返回一个新字符串 console.log(‘y’.repeat(5)); //yyyyySet数据解构ES6提供了新的数据结构Set.它类似数组,但是成员的值都是唯一的,没有重复的值Set本身是一个构造函数,用来生成Set数据结构语法:const  变量名 = new Set();Set函数可以接受一个数组作为参数,用来初始化       const set = new Set([1, 2, 3, 4]);       const set = new Set([1, 2, 3, 4]);        console.log(set.size);//size相等于数组.length1)利用set去重使用Set()将数组去重,再将去重后的set转换为真正的数组const s3 = new Set([‘a’, ‘a’, ‘b’, ‘c’]);const arr = […s3];console.log(arr); //结果:[“a”, “b”, “c”]2)set对象实例方法:       //添加        const s4 = new Set();        s4.add(‘a’).add(‘b’);        console.log(s4); //{“a”, “b”}        //删除        const s2 = s4.delete(‘a’);        console.log(s2); //true:表示删除成功,false:没有该元素        // 结果:true        //判断某一个值是否是set数据结构中的成员 使用 has        const r1 = s4.has(‘b’);        console.log(r1); //是:true  不是:false        //清空set数据结构中值,使用clear()        s4.clear();        console.log(s4.size); //0:清除成功4)遍历Set结构的实例与数组一样,也拥有forEach()方法,用于对每个成员执行某种操作,没用返回值      const s5 = new Set([AD:【E企盈小程序开发公司】E企盈系统专业开发:直播系统,直播平台系统源码,小程序,商城版小程序,分销小程序,小程序定制,微分销,微商,微信分销,微信分销商城,微信分销系统,微信分销管理,微信分销平台,微商代理系统,E企盈是专业的直播小,E企盈是专业的直播小程序,公众号分销系统,营销系统,社群私域流量卖货系统技术开发商,热线:4006-838-530

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » ES6
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏