ES6常用知识小结

简介: ES6常用知识小结



1let 关键字

let 关键字用来声明变量,使用 let 声明的变量有几个特点:

  1. 不允许重复声明;
  2. 块儿级作用域(局部变量);
  3. 不存在变量提升;
  4. 不影响作用域链;

2const 关键字

const 关键字用来声明常量const 声明有以下特点:

  1. 声明必须赋初始值;
  2. 标识符一般为大写(习惯);
  3. 不允许重复声明;
  4. 值不允许修改;
  5. 块儿级作用域(局部变量);

3、模板字符串

模板字符串(template string)是增强版的字符串,用反引号(`)标识,特点:

        字符串中可以出现换行符

        可以使用 ${xxx} 形式引用变量;

       

<script>
        //  声明字符串的方法:单引号('')、双引号("")、反引号(``)
        //  声明
        let string = `字符串`;
        console.log(string);//字符串
        //  特性
        //  1、字符串中可以出现换行符 
        let str =
            `<div>
                <div>一</div> 
                <div>二</div> 
                <div>三</div> 
                <div>四</div>
            </div>`;
        console.log(str);
        //  2、可以使用 ${xxx} 形式引用变量 
        let s = "小明";
        let out = `${s}跑的真快!`;
        console.log(out);//小明跑的真快
    </script>

4、简化对象和函数写法

ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁;

5、箭头函数

ES6允许使用箭头(=>)定义函数,箭头函数提供了一种更加简洁的函数书写方式,箭头函数多用于匿名函数的定义;

箭头函数的注意点:

  1. 如果形参只有一个,则小括号可以省略;
  2. 函数体如果只有一条语句,则花括号可以省略,函数的返回值为该条语句的执行结果;
  3. 箭头函数 this 指向声明时所在作用域下 this 的值;
  4. 箭头函数不能作为构造函数实例化;
  5. 不能使用 arguments

特性:

  1. 箭头函数的this是静态的,始终指向函数声明时所在作用域下的this的值;
  2. 不能作为构造实例化对象;
  3. 不能使用 arguments 变量;

6、ES6中函数参数的默认值

<script>
        //  ES6允许使用箭头(=>)定义函数
        //  传统写法:无参数
        var say = function () {
            console.log("hello!");
        }
        say();
        //  ES6箭头函数: 无参数
        let speak = () => console.log("hello 哈哈!");
        speak();
        //  特性
        //  箭头函数的this是静态的,始终指向函数声明时所在作用域下的this的值 
        const school = {
            name: "大哥",
        }
        //  传统函数
        function getName() {
            console.log("getName:" + this.name);
        }
        //  箭头函数
        getName1 = () => console.log("getName1:" + this.name);
        //  直接调用 
        getName();
        getName1();
        //  使用call调用 
        getName.call(school);
        getName1.call(school);
        //  结论:箭头函数的this是静态的,始终指向函数声明时所在作用域下的this的值
    </script>
目录
相关文章
|
8月前
|
前端开发 JavaScript Java
ES11,ES12,ES13
ES11,ES12,ES13
72 1
|
8月前
|
前端开发 JavaScript
ES6(三)
es6补充知识
47 1
|
13天前
|
前端开发 JavaScript 网络架构
|
9月前
|
前端开发 安全
说说你的ES7-ES12的了解
说说你的ES7-ES12的了解
|
7月前
es_详解
es_详解
24 0
|
8月前
|
JavaScript 前端开发 索引
ES9,ES10
ES9,ES10
45 0
|
9月前
|
JSON 资源调度 JavaScript
ES6 Day01
ES6 Day01
46 0
|
9月前
ES6 Day02
ES6 Day02
36 0
|
9月前
|
前端开发 容器
ES6 Day04
ES6 Day04
56 0
|
11月前
|
JavaScript 前端开发 Java
【ES6】初识
【ES6】初识