ES6模块化

前言

语法:import export (注意有无default)

环境:babel编译ES6语法,模块化可用webpack 和rollup

ES6 Class本身是个语法糖,实际系统默认帮我们转成JS的构造函数

JS构造函数方式:

class Hello(x,y){
this.x=x;
this.y=y;
}
Hello.protoype.add=function(){
return this.x +this.y;
}
const m =new Hello(2,3);
console.log(m.add()); // 5
typeof Hello === "function" . //true
Hello === Hello.prototype.constructor //true
Hello.__proto__ === Hello.prototype //true

ES6书写方式:

export class Hello() {
constructor(x,y){
this.x = x;
this.y = y;
}
add() {
return this.x +this.y;
}
}
const m =new Hello(2,3);
console.log(m.add()); // 5
typeof Hello === "function" . //true
Hello === Hello.prototype.constructor //true
Hello.__proto__ === Hello.prototype //true

  

原文地址:https://www.cnblogs.com/fuGuy/p/9215725.html

时间: 2024-10-18 06:02:30

ES6模块化的相关文章

###大一统的模块化规范-es6模块化

1.node.js中通过babel体验es6模块化 npm安装 babel.config.js ###ES6模块化的基本语法 1.默认导出与导入 export default import 接收名称 from '模块标识符' 2.按需导出--export let s1 = 'aaa' ####直接导入并执行模块代码 我们只想单纯执行某个模块中的代码,并不需要得到模块中向外暴露的成员,此时,可以直接导入并执行模块代码 当前文件模块为m2.js 在当前模块中执行依据各for循环操作 for(let 

ES6 模块化module

导入 // ES6 模块化; // 导入 和 导出 // 例如:a.js 需要 b.js 的逻辑 // 导入: import {a,b} from './b.js'; console.log(a,b); import {a as c,b as d} from './b.js'; console.log(c,d); import {e} from './b.js'; console.log(e); import myobj from './b.js'; console.log(myobj); im

js 模块化的一些理解和es6模块化学习

模块化 1 IIFE 2 commonjs 3 浏览器中js的模块化 4 简单理解模块加载器的原理  5 es6 之前在参加百度前端技术学院做的小题目的时候,自己写模块的时候 都是写成立即调用表达式(IIFE)的模式,比如单个功能的时候当时想到是不会涉及到全局变量的污染,在封装基础的模块(比如里面的表单验证功能) (function(win){ var obj = {}; function add() { console.log("add"); } obj.add = add; win

nodejs和es6模块化的不同

nodejs采用的是CommonJS规范,而es6自己制定了一套模块化规范,两者语法不同,功能类似. CommonJS规范: 有require.exports.module三个对象,处理模块之间的依赖. ES6规范有: import.export两个对象,处理模块之间的依赖. 原文地址:https://www.cnblogs.com/ruleblog/p/10820827.html

amd、cmd、CommonJS以及ES6模块化

AMD.CMD.CommonJs.ES6的对比 他们都是用于在模块化定义中使用的,AMD.CMD.CommonJs是ES5中提供的模块化编程的方案,import/export是ES6中定义新增的 什么是AMD.CMD.CommonJs? 他们之间有什么区别? 项目当中是如何使用? 1)AMD-异步模块定义 AMD是RequireJS在推广过程中对模块定义的规范化产出,它是一个概念,RequireJS是对这个概念的实现,就好比JavaScript语言是对ECMAScript规范的实现.AMD是一个

ES6 模块化笔记

ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量. ES6 模块不是对象,而是通过export命令显式指定输出的代码,再通过import命令输入. // ES6模块 import { stat, exists, readFile } from 'fs'; 需要特别注意的是,export命令规定的是对外的接口,必须与模块内部的变量建立一一对应关系. export常用的写法如下: 1 // 写法1 2 export var firstName = 'Mi

ES6模块化及优点,简单案例让你秒懂

模块化:模块是一个文件     好处:         1.减少命名冲突         2.避免引入时的层层依赖         3.可以提升执行效率     **第一种方法***********************         1.如何导出(暴露)             export let run =function(){                 console.log("run-->fun")             }             expo

es6模块化设计

//导出 //方式一 export const name = 'hello' export let addr = 'chengdu' export var list = [1,2,3] //方式二 const name = 'hello' let addr = 'chengdu' var list = [1,2,3] export default name //默认导出,只能有一个默认导出 export { //name, addr, list } //导入 import { name,addr

node通过bable体验es6模块化

npm i --save--dev @bable/core @bable/cil @bable/preset-env @bable/node // npm i --save @bable/polyfill //项目创建配置文件 bable.config.js const presets = [ [ "@bable/env" , { targets: { edge: '17', chrom: '67' } }] ] module.exports = {presets} //npx bab