zoukankan      html  css  js  c++  java
  • ES6

    ES6新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。

    1 {
    2   let a = 10;
    3   var b = 1;
    4 }
    5 
    6 a // ReferenceError: a is not defined.
    7 b // 1

    上面代码在代码块之中,分别用letvar声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

    for循环的计数器,就很合适使用let命令。

    1 for (let i = 0; i < 10; i++) {}
    2 
    3 console.log(i);
    4 //ReferenceError: i is not defined

    上面代码中,计数器i只在for循环体内有效,在循环体外引用就会报错。

    下面的代码如果使用var,最后输出的是10。

    1 var a = [];
    2 for (var i = 0; i < 10; i++) {
    3   a[i] = function () {
    4     console.log(i);
    5   };
    6 }
    7 a[6](); // 10

    上面代码中,变量ivar声明的,在全局范围内都有效。所以每一次循环,新的i值都会覆盖旧值,导致最后输出的是最后一轮的i的值。

    如果使用let,声明的变量仅在块级作用域内有效,最后输出的是6。

    1 var a = [];
    2 for (let i = 0; i < 10; i++) {
    3   a[i] = function () {
    4     console.log(i);
    5   };
    6 }
    7 a[6](); // 6

    上面代码中,变量ilet声明的,当前的i只在本轮循环有效,所以每一次循环的i其实都是一个新的变量,所以最后输出的是6。

    不存在变量提升

    let不像var那样会发生“变量提升”现象。所以,变量一定要在声明后使用,否则报错

    1 console.log(foo); // 输出undefined
    2 console.log(bar); // 报错ReferenceError
    3 
    4 var foo = 2;
    5 let bar = 2;

    上面代码中,变量foovar命令声明,会发生变量提升,即脚本开始运行时,变量foo已经存在了,但是没有值,所以会输出undefined。变量barlet命令声明,不会发生变量提升。这表示在声明它之前,变量bar是不存在的,这时如果用到它,就会抛出一个错误。

    不允许重复声明

    let不允许在相同作用域内,重复声明同一个变量。

     1 // 报错
     2 function () {
     3   let a = 10;
     4   var a = 1;
     5 }
     6 
     7 // 报错
     8 function () {
     9   let a = 10;
    10   let a = 1;
    11 }

    因此,不能在函数内部重新声明参数。

    1 function func(arg) {
    2   let arg; // 报错
    3 }
    4 
    5 function func(arg) {
    6   {
    7     let arg; // 不报错
    8   }
    9 }

    const命令

    const声明一个只读的常量。一旦声明,常量的值就不能改变。

    const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。

    对于const来说,只声明不赋值,就会报错。

    const的作用域与let命令相同:只在声明所在的块级作用域内有效。

     模板字符串

    1 var a = 1;
    2     var b = 2;
    3     //var str = "哈哈哈" + a + "嘿嘿嘿" + b;
    4     // 这里用的不是单引号是Tab上边的反引号
    5     var str = `哈哈哈${a}嘿嘿嘿${b}`;
    6     console.log(str)

    如上  我们可以使用这种方式来代替+号的使用

    箭头函数

    1  // function(){} === ()=>{}
    2 
    3     // 1.this的指向发生改变,指向了定义对象时的对象
    4     // 2.arguments不能使用

    对象的单体模式

    这个是可以解决箭头函数的this指向问题的

    1 var person = {
    2         name:'张三',
    3         age: 18,
    4        
    5         fav(){
    6             console.log(this);
    7         }
    8     }
    9     person.fav();

    面向对象

     1 // 构造函数的方式创建对象
     2     //  function Animal(name,age){
     3     //      this.name = name;
     4     //      this.age = age;
     5         
     6     //  }
     7     //  Animal.prototype.showName = function(){
     8     //      console.log(this.name);
     9     //  }
    10     //  Animal.prototype.showName2 = function(){
    11     //      console.log(this.name);
    12     //  }
    13     //  Animal.prototype.showName3 = function(){
    14     //      console.log(this.name);
    15     //  }
    16     //  Animal.prototype.showName4 = function(){
    17     //      console.log(this.name);
    18     //  }
    19     //  var dog = new Animal('日天',18)
    20 
    21 
    22 
    23     class Animal{
    24         constructor(name,age){
    25             this.name = name;
    26             this.age = age;
    27         }
    28         showName(){
    29             // 一定不要加逗号
    30             console.log(this.name)
    31         }
    32     }
    33     var d = new Animal('张三',19);
    34     d.showName();
  • 相关阅读:
    网页中15秒后重新发送验证码,多少秒后发送验证码
    javascript 数组去重 unique
    微信支付和微信支付通知基于sdk的说明
    php对象序列化和cookie的问题,反序列化false
    php对象序列化总出错false
    图片懒加载lazyload.js详解
    手机联动地址选择框,移动端地址联动
    Java类加载原理解析(转)
    location对象介绍
    SpringMVC使用fastjson自定义Converter支持返回jsonp格式(转)
  • 原文地址:https://www.cnblogs.com/cuilinpu/p/10361416.html
Copyright © 2011-2022 走看看