本篇文章给大家谈谈专业网站建设模块化，以及专业的网站建设与优化对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。 今天给各位分享专业网站建设模块化的知识，其中也会对专业的网站建设与优化进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！

1. 模块化开发的核心？

1、模块化开发的核心？

核心：导出和导入；

1、普通模块化：

同级新建文件index.html,a.js.b.js三个文件；

index.html中引入a.js和b.js。（a.js在前）

lt;script src=#34;a.js#34;gt;lt;/scriptgt;

lt;script src=#34;b.js#34;gt;lt;/scriptgt;

a.js中导出：

var modules=(function(){

var name=#39;jack#39;;

var flag=true;

function num(a,b){

return a b;

}

var obj={};

obj.flag=flag;

obj.num=num;

obj.name=name;

return obj;

})()

b.js中导入：

console.log(modules.name)//jack

console.log(modules.num(1,6))//7

console.log(modules.flag)//true

在b.js可以取出a.js中obj的值。

2、commonJs模块化：export

a.js导出：

var name=#39;jack#39;;

var flag=true;

function num(a,b){

return a b;

}

export.module({

name,

flag,

num

)}

b.js导入：

var {name,flag,num}=require(#39;a.js的路径#39;);//name,flag,num可以直接用

var obj=require(#39;a.js的路径#39;);//obj.name=#39;jack#39;,obj.flag=true,obj.num(1,6)=7

3、es6模块化：export导出,import导入

export的基本使用：

a.js:

导出方式一：

export var name=#34;jack#34;;

export var height=1.88;

导出方式二：

var name=#34;jack#34;;

var height=1.88;

export {name,height};

b.js

import {name,height} from #39;a.js#39;;

console.log(name);//jack

console.log(height);//1.88

4、导出函数或类：

//直接导出

//export const num1=123;

//导出函数：

export function add(num1,num2){

return num1 num2

}

//导出类

export class Person{

run(){console.log(#39;this.a#39;)}

}

//导入函数和类

import {add,Person} from #39;./export.js#39;

console.log(add(1,2));

const p=new Person();

p.run()

5、export default:导入者自己命名。(同一个模块中只能有一个default)

//导出

export default function(){

console.log(#39;this.default#39;);

}

//导入

import de from #39;./export.js#39;;

de();

6、普通html中引入export的两个js文件，需要给script的type设为module;

lt;script type=#34;module#34; src=#34;a.js#34;gt;lt;/scriptgt;

7、全部统一导出：*可以导入模块中所有的export变量，

import * as all from #39;./export.js#39;;//all，为*的别名，方便后续使用。

console.log(all.num1,#39;aaa#39;)

模块化开发就是有组织地把一个大程序拆分成独立并互相依赖的多个小文件（模块）。

模块内部有许多私有属性，只向外暴露一部分公开的接口(如可以修改私有属性的方法等)

ES6之前，JavaScript语言一直没有模块（module）体系，无法把大文件有组织地划分成小块，并管理之间地依赖。但是模块化的思想一直存在。因为用Javascript写的代码越来越庞大，而网页也越来越像桌面APP。如此庞杂的代码，如果不进行模块化，就可能引发命名冲突，造成不易复用、维护性高。

关于专业网站建设模块化和专业的网站建设与优化的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。 专业网站建设模块化的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于专业的网站建设与优化、专业网站建设模块化的信息别忘了在本站进行查找喔。