ES6基础

时间：2018-11-02 14:35:14 阅读：165 评论：0 收藏：0 [点我收藏+]

标签：app 覆盖问题 ace his define 出现 iso 通过

零、什么是ECMAScript？

一、let和const

二、模板字符串

三、箭头函数

四、对象的单体模式

五、面向对象

零、什么是ECMAScript？

1997年 ECMAScript 1.0 诞生
1999年12月 ECMAScript 3.0诞生，它是一个巨大的成功，在业界得到了广泛的支持，它奠定了JS的基本语法，被其后版本完全继承。直到今天，我们一开始学习JS，其实就是在学3.0版的语法
2000年的ECMAScript4.0是当下ES6的前身，但由于这个版本太过激烈，对ES3做了彻底升级，所以暂时被“和谐”了
2009年12月，ECMAScript5.0版正式发布。ECMA专家组预计ECMAScript的第五个版本会在2013年中期到2018年作为主流的开发标准。2011年6月，ES5.1版发布，并且成为ISO国际标准
2013年，ES6草案冻结，不再添加新的功能，新的功能将被放到ES7中；2015年6月，ES6正式通过，成为国际标准

http://es6.ruanyifeng.com/

一、let和const

let命令的用法类似于var，但是它声明的是局部变量，而var声明的是全局变量。const命令是用来声明一个只读的常量，一旦声明，就不能修改，const也是局部变量。

var命令会出现变量提升现象，即变量可以在声明之前使用，值为undefined，而let没有变量提升现象。
let不允许在相同的作用域内，重复声明同一个变量。
ES5只有全局作用域和函数作用域，没有块级作用域，因此会带来几种不合理的场景：1.函数内的变量会覆盖函数外的变量，由于变量提升，值为undefined（在函数内打印为undefined，在函数外为正常值）。2.用来计数的循环变量i泄露为全局变量。

二、模板字符串

    $(‘.test‘).append(`
            <a>hello ${append_1}</a> //会在class=‘test‘类中添加a标签
        `)

使用方法` ${1} ` 反引号也可以表示多行字符串

三、箭头函数

//无形参
var f = () => 5;
// 等同于
var f = function () { return 5 };
 
//多个形参
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
  return num1 + num2;
};

函数体中this是函数对象，而箭头函数中的this是window对象

四、对象的单体模式

由于箭头函数this的指向问题，推出的一种写法：

    var person = {
            name: ‘name‘,
            age: 18,
            fav(){
                console.log(this);
                console.log(this.age);
            }
    }
    person.fav();
this是person

    var person = {
            name: ‘name‘,
            age: 18,
            fav: ()=>{
                console.log(this);
                console.log(this.age);
            }
    }
    person.fav();
this是window

五、面向对象

之前版本：

       function Animal(name,age){
            this.name = name;
            this.age = age;
 
        }
        Animal.prototype.showName = function(){
            console.log(this.name);
            console.log(this.age);
        }
 
        var a = new Animal(‘小黄‘,5);
        a.showName();

ES6引入了class的概念

class Cat{
        // 相当于 __init__
        constructor(name, age){
            this.name = name;
            this.age = age;
        }
        show_name(){
            console.log(this.name);
        }
        show_age(){
            console.log(this.age);
        }
    }
    var tom = new Cat(‘tom‘, 18);
    tom.show_age();
    tom.show_name();

ES6基础

标签：app 覆盖问题 ace his define 出现 iso 通过

原文地址：https://www.cnblogs.com/changwoo/p/9895576.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行