• ECMAScript 6(es6)


    1、ECMAScript 6

    1.1 什么是ECMAScript 6

    ECMAScript 6.0(简称ES6)是JAvascript语言的下一代标准。它的目标,是使得Javascript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

    1.2 ECMAScript 6和JAvascript的关系

    ECMAScript 6和JAvascript的关系是,前者是后者的规格,后者是前者的一种实现(另外的ECMAScript 方言还有Jscript和ActionScript)

    2、基本语法

    2.1 let声明变量

    //var 声明的变量没有局部作用域

    //let声明的变量有局部作用域,只能用在对应的代码块中

    {

    //定义变量

    var a=0

    let b=2

    }

    console.log(a)//0

    console.log(b)//b is not defined

    //var 声明的变量可以被多次赋值

    //let声明的变量只能被一次赋值

    var m=1;

    var m=2;

    let n=10;

    let n=20;

    console.log(m) //2

    console.log(n)//Identifier 'n' has already been declared

    2.2 const声明常量

    在es6中声明的常量必须赋值,并且不能再次赋值。

    const a=0;

    a=4;//Assignment to constant variable.

    const b;//Missing initializer in const declaration

    2.3 解构赋值

    解构赋值是对赋值运算符的扩展。它是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值。

    在代码书写上简洁且可读,语义更加清晰明了;也方便了复杂对象中数据字段获取 

     数组解构

    传统:

    let a=1,b=2,c=3;

    console.log(a,b,c)

    ES6:

    let[x,y,z]=[1,2,3]

    console.log(x,y,z)

    对象解构

    传统:

    let user={name:'Helen',age:18}

    let name1=user.name

    let age1=user.age

    console.log(name1,age1)

    ES6:

    let{name,age}=user //注意:结构的变量必须是user中的属性

    cosnole.log(name,age)

    2.4 模板字符串

    模板

    字符串相当于加强版字符串,用反引号`,除了作为普通字符串,还可以用来定义多行字符串,还可以在字符串中加入变量和表达式 

    字符串中插入变量和表达式。变量名写在${}中,${}中可以放入JavaScript表达式。

    let name="lucy"

    let age=20

    let info=`My name is ${name} ,

    I am ${age+1}`

    console.log(info)

     

     2.5 声明对象简写

     //传统定义对象

         const name="lucy"

         const age=18

         const  user1={name:name,age:age}

         console.log(user1)

         //es6

         const user2={name,age}

         console.log(user2)

     2.6 对象扩展运算符

    扩展运算符(...)用于取出参数对象所有可遍历属性然后拷贝到当前对象

        //1、拷贝对象

        let person1={name:"Amy",age:18}

        let someone={...person1}

        console.log(someone)

        //2、合并对象

        let age={age:18}

        let name={name:"Amy"}

        let person2={...age,...name}

        console.log(person2)

     

     2.7 箭头函数

    箭头函数多用于匿名函数的定义

     //传统

       var f1=function(a){

           return a

       }

       console.log(f1(1))

       //ES6使用箭头函数定义

       //参数=>函数体

       var f2=a=>a

       console.log(f2(1))

       var f3=function(m,n){

           return m+n

       }

       console.log(f3(1,2))

       var f4=(m,n)=>m+n

       console.log(f4(1,2))

     

     

  • 相关阅读:
    YOLOv8/5不显示FLPOs
    php+mysql羽毛球场地租赁管理系统
    使用 Helm 安装 极狐GitLab
    leetcode 1523. 在区间范围内统计奇数数目
    批发商/分销商会有一波向B2B转型的浪潮
    再也不想去阿里巴巴面试了,6年测开面试遭到这样打击.....
    Linux命令总结
    Mac SpringBoot项目 Gradle 7.3 转 Maven 手把手教学,包学会~
    【JavaScript面试】isArray() 、Array.of()、Array.from() 方法
    Curl漏洞-- CVE-2023-38545解决方案
  • 原文地址:https://blog.csdn.net/m0_59860403/article/details/125465283