ES6之基础知识

一. ES6中提供了两个声明变量的关键字: let 和 const

ES6 用let来声明变量,它的用法类似于var。
1.1 let的使用
 -1. let声明的变量,多了一个块级作用域
	  var 声明的有2个作用域 : 函数/全局 
	  let 声明的有3个作用域  : 函数/全局/块级作用域
	  {
	     let a = 10;
	     var b = 1;
	  }
	    
	  a // ReferenceError: a is not defined.
	  b // 1
	
 -2 不存在变量提升
    // let 的情况
    console.log(bar); //报错ReferenceError
    let bar = 2;

 -3 不允许重复声明
    let a = 10;
    let a = 1;	//报错 Identifier 'a' has already been declared

1.2 const的使用
	const声明一个只读的常量。常量:值不可以改变的量 

- const声明的量不可以改变
    const PI = 3.1415;
    PI = 3; //报错

- const声明的变量必须给初始值
    const name =  '';
    name = '小糖'

- 如果const声明了一个对象,仅仅保证地址不变
    const obj = {name:'zs'};
    obj.age = 18; //正确
    obj = {}; //报错

- 其他用法和let一样
   只能在当前代码块中使用
   不会提升
   不能重复声明

const 修饰的是一个对象 , 对象是引用类型,所以修改对象里面的内容,不影响地址,
const obj = {
  name : 'zs'
}

obj.name = '小天'
console.log(obj.name);   //  小天

// obj = {}

// 总结: 
// 1. es5 : var 
// 2. es6 : let/const 替换 var 
// 3. 修饰常量 (不变的量)  用 const
// 4. 修改变量 (可变的量)  用 let 
// 5. 万事不决 用 let  

let与const的使用场景
	1. 如果声明的变量不需要改变,那么使用const
	2. 如果声明的变量需要改变,那么用let
	3. 学了const和let之后,尽量别用var

=========================================================================================================

二. 模板字符串

模板字面量 是允许嵌入表达式的字符串字面量。你可以使用多行字符串和字符串插值功能。

 // 1. 通过``可以定义一个字符串
 let str = `hello world`

 // 2. 模板字符串内部允许换行
    let str = `
      hello
      
      world
    `

 // 3. 模板字符串内部可以使用表达式
let str = `
	你好,我是${name}
`

=========================================================================================================
三. 箭头函数

***箭头函数的注意点***

1. 箭头函数内部没有this,因此箭头函数内部的this指向了外部的this(很爽)
2. 箭头函数不能作为构造函数,因为箭头函数没有this

ES6标准新增了一种新的函数:Arrow Function(箭头函数)

为什么叫Arrow Function?因为它的定义用的就是一个箭头:

3.1 基本使用

- function 删掉,   () 后面加个 => 

    let fn = function() {
        console.log(123);
    }
    
    相当于
    //语法: (参数列表) => {函数体}
    let fn = () => {
        console.log(123);
    }

3.2 参数详解

- 如果没有参数列表,使用()表示参数列表
    var sum = () => {
        console.log('哈哈')
    };
    // 等同于:
    var sum = function() {    
        console.log('哈哈')
    };

- 如果只有一个参数,可以省略()
    // 等同于:
    var sum = function(n1) {    
        console.log('哈哈')
    };
    
    var sum = n1 => {
        console.log('哈哈')
    };
    
- 如果有多个参数,需要使用()把参数列表括起来
    var sum = function(n1, n2) {    
        console.log('哈哈')
    };
    
    var sum = (n1, n2) => {
        console.log('哈哈')
    };


3.3 返回值详解

- 如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来

    var sum = n1 => {
        console.log('哈哈')
        console.log('哈哈')
    };

- 如果函数体只有一行一句,并且需要返回这个值,那么可以省略{}和return

    var fn = function(n1, n2) {
        return n1 + n2;
    }
    var fn = (n1, n2) => n1 + n2;

***箭头函数中的this问题 ***

以前 this => 谁调用this所在的函数,this就指向谁 


你可能感兴趣的:(ECMAScript)