首页 > 其他分享 >ES6的模块化

ES6的模块化

时间:2022-10-25 21:58:06浏览次数:52  
标签:ES6 obj 模块化 导出 js export import

ES6的模块化

模块的思想,将对应的功能代码封装为一个模块(js代码 css代码 html代码)。

想要使用别人就导入,想要给别人用就导出。复用。

模块化的常用的模式

amd (在对应的加载之前导入)

cmd (在用的时候导入)

comment.js (基于amd和cmd之上)

es6的模块化的关键词(要想导入想要导出)

import 导入

export 导出

export的使用

第一种 export default (只能声明一次)

// //默认导出只有一个 如果使用export default 导出的可以使用对应的一个名字来接
export default {
   obj,
   str,
   say
}

  接收

import obj from './test.js'
console.log(obj) //{obj,str,say}

 第二种导出

//如果直接使用的对应的export 导出那么必须通过{键}来接
export const obj = {
    name:'jack',
    age:18
}
//如果导出的是值类型 一定要写变量名
export const str = "你好世界"
export const say = ()=>{
    console.log('hello world');
}

 

接收

 import {obj,str,say} from './test.js'

  

第三种导出

const name = 'tom'
//第三种导出
export {
    //只能写变量
    name
}

  

接收  

import {name} from './test.js'

  

import使用
import 名字 from '地址'

  

 

 

 

 

 

 

 

 

 

 

 

标签:ES6,obj,模块化,导出,js,export,import
From: https://www.cnblogs.com/hofenglang/p/16826487.html

相关文章

  • web服务器5模块化
    自定义模块//console.log(module)//自定义模块中,默认情况,module.exports={}//空对象constname='zs'//挂载方法module.exports.usename=name//挂载方法......
  • ES6之class类
    //手机构造函数functionPhone(brand,price){this.brand=brand;this.price=price;}//添加方法......
  • ES6之map
    map为键值对集合letm=newMap();m.set('name','小白');m.set('chang',function(){console.log("改变自己");})......
  • ES6之set集合
    letarr=[1,2,3,4,5,4,3,2,1];//数组去重letresult=[...newSet(arr)];console.log(result);//交集letarr......
  • #yyds干货盘点#ES6的扩展运算
    ES6通过扩展元素符​​...​​,好比 ​​rest​​ 参数的逆运算,将一个数组转为用逗号分隔的参数序列:console.log(...[1,2,3])//123console.log(1,...[2,3,4],5)//......
  • ES6生成器函数2
    //模拟获取用户数据订单数据和商品数据functiongetUsers(){setTimeout(()=>{letdata="用户数据";//......
  • ES6生成器
    //生成器就是一个特殊的函数function*gen(params){console.log("111");yield'两只老虎';console.log("......
  • Es6,字符串新增的方法
    Es6,字符串新增的方法 String.fromCodePoint()ES5提供String.fromCharCode()方法,用于从Unicode码点返回对应字符,但是这个方法不能识别码点大于0xFFFF的字符。Stri......
  • Es6,对象新增的方法
    Es6,对象新增的方法  Object.is()  ES5比较两个值是否相等,只有两个运算符:相等运算符(==)和严格相等运算符(===)。它们都有缺点,前者会自动转换数据类型,后者的NaN不等......
  • 3_ES6中拓展运算符的使用
    一,拓展运算符(...)拓展运算符(...):它会以参数序列的形式输出,更白话讲,比如数组,它可以把数组里面的东西一个一个的输出出来,例如1letarr1=["你","好","V","U","E",1,2]2......