ES Modules是什么

百科问答 投稿 7900 0 评论

ES Modules是什么

es6新语法?以下内容主要是针对遇上ES Modules是什么的问题,我们该怎么理解呢。ESModules(也称为ECMAScriptModules)是javascript的新模块系统,用来动态地导入和导出模块,下面这篇文章将为你提供一个参考思路,希望能帮你解决到相关问题。

es6新语法

ES6将弱类型的js提升为中弱类型。我们也一定要学习ES6。

ES6新增知识点:

1、

定义变量

之前定义变量一直用的是var,但是es6中可以使用let和const

但是let有几个特点:

-不允许声明变量

不存在预解析

在大括号中声明的变量只能在大括号中使用

const的特点:

不允许重复声明

不允许重新赋值(可以给对象中新增属性)

声明的时候必须赋值

不存在预解析

在大括号中声明的变量只能在大括号中使用,如if、for的大括号中声明的变量

2、

箭头函数:箭头函数是用来简写函数的

注意:如果只有一个小形参时,小括号可以省略

注意:如果代码块中只有一行代码,箭头函数可以省略大括号,并将这行代码作为返回值

let fn = ()=>;{console.log(111);}

1

1

箭头函数使用注意事项:

(1) 箭头函数中的this比较混轮,所以在函数和方法中使用到this的时候,就不要用箭头函数

(2) 箭头函数中没有arguments

函数默认值:

es6中可以定义默认值:

function add(a,b=2){

return a + b;

}

console.log(add(5));

1

2

3

4

1

2

3

4

解构赋值:

解析一个数据结构并赋值,可以快速的从对象或数组中取出需要的内容,对象使用大括号,数组使用中括号

解构对象:

let obj = {

name:";张三";,

age:12,

sex:";男";,

}

let {name} = obj;

/*

表示从obj中获取name属性,并赋值给声明的name变量

*/

1

2

3

4

5

6

7

8

9

1

2

3

4

5

6

7

8

9

注意:obj必须是一个对象。obj中必须有name属性

3、

this 关键字

每个函数内容都有一个关键字叫做this。不同的情况下,this代表的内容也是不一样的。

(1)普通函数中的this代表window对象

function fn(){

console.log(this);

}

fn(); // window

1

2

3

4

1

2

3

4

(2)定时器中的this代表window

var obj = {

eat:function(){

setTimeout(function(){

console.log(this);

});

}

};

obj.eat(); // window

1

2

3

4

5

6

7

8

1

2

3

4

5

6

7

8

(3)自调用函数中的this代表window

document.querySelector(";button";).onclick=function(){

(function(){

console.log(this);

})()

}

// window

1

2

3

4

5

6

1

2

3

4

5

6

(4)对象方法中的this代表调用这个方法的对象

document.querySelector(";button";).onclick=function(){

(function(){

console.log(this);

})()

}

// window

1

2

3

4

5

6

1

2

3

4

5

6

(5)事件函数中的this代表当前事件的事件源

document.querySelector(";button";).onclick=function(){

console.log(this);

}

// <;button>;按钮<;/button>;

1

2

3

4

1

2

3

4

(6)箭头函数的this在定义箭头函数的时候就知道了,代表上一行代码的this

document.querySelector(";button";).onclick=function(){

// 这里的this代表button按钮,所以箭头函数的this也是button按钮

setTimeout(()=>;{console.log(this);});

}

// <;button>;按钮<;/button>;

1

2

3

4

5

1

2

3

4

5

4、 上下文调用模式

也叫作方法借用模式。任何函数都能调用call、apply、bind这三个方法。这三个方法主要用于改变函数中this的指向。

call:call方法不仅可以用来调用函数,还可以指定调用函数的this指向

ES Modules是什么

1、ESModules(也称为ECMAScriptModules)是javascript的新模块系统,用来动态地导入和导出模块。

2、它实现了原生模块,这是一个与Node.js模块加载器相兼容的语法,与其他模块系统如CommonJS和AMD相比,它有明显的优势和改进。

3、它在ES2020中被添加,并且浏览器也已经有的大多数页面已经有了支持。

4、ESModules可以帮助开发者更好地管理和解决依赖关系,有助于减少项目之间重复的代码,并且让dom结构更加稳定、可预测性更好。

5、它有助于增强项目的代码重用和可维护性,并且可以使代码更结构化、更加模块化和更具可读性与可理解性。

6、ESModules遵循着语法,允许开发者可以在全局和模块之间易于引入和传递的方式来实现这一目的,它也可以让开发者更加容易的将项目的组件组合在一起,以在现代浏览器中运行JavaScript。

7、安全性方面,ESModules不能够被全局变量污染,可以让开发者制定和管理module层级的变量空间,使开发者编写的代码在不同模块中都能够安全地运行。

8、ESModules可以帮助开发者更好的管理和解决依赖关系,有效减少项目之间的重复代码,使dom结构更加稳定,也提高了安全性,是javascript开发的好伙伴。

以上就是为你整理的ES Modules是什么全部内容,希望文章能够帮你解决相关问题,更多请关注本站科技问答百科栏目的其它相关文章!

编程笔记 » ES Modules是什么

赞同 (42) or 分享 (0)
游客 发表我的评论   换个身份
取消评论

表情
(0)个小伙伴在吐槽