手记

【九月打卡】第12天 ES与JS的关系及环境搭建(4)

第一板块:4小时快速体验ES6-10的强大,2-15;2-16;2-17;2-18;1-19,大谷

第二板块:

  1. es6模块化(module)export和import

    ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代现有的 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。CommonJS 和 AMD 模块,都只能在运行时确定这些东西。比如,CommonJS 模块就是对象,输入时必须查找对象属性。ES6 模块不是对象,而是通过export命令显式指定输出的代码,再通过import命令输入。

import {xxx} from "fs";
  1. ES全家福

    要点一:ES的版本的命名规范

    区分ES5与ES6以后的版本

    ES5到ES2015添加了类和模块,箭头函数等。

    ES2015到ES2016,Array.prototype.includes,求幂操作符。

    ES2016到ES2017,字符串填充,函数参数的尾逗号,增加异步函数等。

    ES2017到ES2018,共享内存和Atomics,用于正则表达式的‘dotall’标识。

    ES2018到ES2019,更友好的JSON.stringify,为Symbol类型增加Symbol.prototype.description的一个访问器属性。

第三板块:示例

// export
//方式一
export let name = '张三';
 
//方式二(推荐)可以一起在模块结束位置输出
let age = 12;
let height = 14;
//导出多个数据,单个数据也一样。
export {age,height};
//export age;或者export 12;都是错误的写法
 
//方式三(输出函数)
//1
export let reduce1 = function reduce1(){
    console.log('reduce1函数减少');
};
export let add1 = ()=>{
    console.log('add1函数增加');
};
//2
let reduce2 = function reduce2(){
    console.log('reduce2函数减少');
};
export {reduce2};
function reduce2k(){
    console.log('reduce2k函数减少');
};
export {reduce2k};
let add2 = ()=>{
    console.log('add2函数增加');
};
export {add2};
//3
export function reduce3(){
    console.log('reduce3函数减少');
};
//export function(){} 没有函数名,不能这么写
//export ()=>{} 没有函数名,不能这么写
//export add3(){} 不能这样写
//方式四(类)

// import

import {name} from './Modules';
console.log(name);
import {age,height} from './Modules';
console.log(age + "===" + height);

第四板块:






0人推荐
随时随地看视频
慕课网APP