ES6 简单整理 - NDweb的个人空间 - 开源中国

1.变量声明 let 和 const

let与const 都是块级作用域，

  • let
function name(){
    let age = 12; //age只在name()函数中存在
}
  • const
const name = 'tom'
name = 'jack'//再次赋值会报错

2.字符串模板

  • Es5
//例1
var name = 'jack';
console.log('hello '+name)
//例2
var msg = 'Hi \
man!
'//以反斜杠用来换行
  • Es6
//例1
const name = 'jack'
console.log('hello ${name}');//hello jack
//例2
onst template = `<div>
        <span>hello world</span>
    </div>`

3.扩展的对象的功能

  • Es5
//例1
function people(name,age){
    return {
        name:name
        age:age
    }
}
//例2
const people = {
    name : 'tom',
    getThisName:function(){
        console.log(this.name)
    }
}
  • Es6
//例1
function people(name,age){
    return {
        name
        age
    }
}
//例2
const people = {
    name : 'tom',
    getThisName(){
        console.log(this.name)
    }
}

4.import 和 export

//全部导入
import people from './example'

//有一种特殊情况，即允许你将整个模块当作单一对象进行导入
//该模块的所有导出都会作为对象的属性存在
import * as example from "./example.js"
console.log(example.name)
console.log(example.age)
console.log(example.getName())

//导入部分
import {name, age} from './example'

// 导出默认, 有且只有一个默认
export default App

// 部分导出
export class App extend Component {};

5.class类的支持

Es6中添加了对class类的支持：

//定义class
class Animal(){
    //ES6中新型构造器
    constructor(name) {
        this.name = name;
    }
    //实例方法
    sayName() {
        console.log('My name is '+this.name);
    }
}

//类的继承
class Programmer extends Animal {
    constructor(name) {
        //直接调用父类构造器进行初始化
        super(name);
    }
    program() {
        console.log("I'm coding...");
    }
}
//测试我们的类
var animal=new Animal('dummy'),
wayou=new Programmer('wayou');
animal.sayName();//输出 ‘My name is dummy’
wayou.sayName();//输出 ‘My name is wayou’
wayou.program();//输出 ‘I'm coding...’

6.for of



var someArray = [ "a", "b", "c" ];
 
for (v of someArray) {
    console.log(v);//输出 a,b,c
}

原网址: 访问
创建于: 2018-10-13 16:47:01
目录: default
标签: 无

未标明原创文章均为采集，版权归作者所有，转载无需和我联系，请注明原出处，南摩阿彌陀佛，知识，不只知道，要得到

请先后发表评论
  • 最新评论
  • 总共0条评论