在ES6的模塊化開發中,一個JS文件就相當一個模塊,其他JS文件想要使用模塊中的數據,模塊必須export導出,其他JS文件進行import導入才行。
第一步,先引入對應的JS文件,通過script標簽,不過不能單單用script標簽,如果是這樣的話此時各個JS文件還不是一個模塊,得設置一個type屬性的值為module,如下:
<script src="./first.js" type="moudule"></script>
第二步,在其他的JS文件進行導出,而導出的方式太多了,下面一一介紹:
說一下ES5及之前函數和類的區別,函數是首字母小寫的,比如function add(){},而類是function Person(){},首字母是大寫的;而在ES6中,類的定義可以寫成 class Persion{}
export default只能在JS文件使用一次,可以導出變量,函數,對象都可以。記得只能使用一次,他的好處是導入方可以自己取名字來使用
第三步,若JS文件需要用到其他JS文件,需要導入該JS文件的某些數據,導入方式如下:
當要導入的數據太多時,可采用下面方式: