JavaScript 几种循环方式以及模块化的总结

2023-07-17 07:15:04 167

小小最近学习到了js的几种循环方式，对这几种循环方式进行总结。以及对模块化的相关知识点进行总结，

循环方式

循环方式分为好几种循环方式，分别是for循环，forEach循环，map循环，for..in循环，for…of循环，jquery的循环。

小小将会依次对这几种循环方式进行介绍。

一般数组遍历循环

这里使用常用的数组遍历方式。

一般来说，常用的数组遍历如下

for(varindex=0;index
这样就完成了常规的循环遍历。
在es5以后，添加了forEach，通过forEach进行循环遍历
myArray.forEach(function(value){
console.log(value);
});
这里通过forEach函数，完成对数组的遍历。
缺点：这样使用有个致命的缺点，不能中断循环，即，不能使用break和return
for-in循环遍历


for-in循环是为专有对象进行设置的，如下
varobj={a:1,b:2,c:3};
循环结果如下
for(varpropinobj){
console.log("obj."+prop+"="+obj[prop]);
}

//输出:
//"obj.a=1"
//"obj.b=2"
//"obj.c=3"
循环一个数组的时候，使用如下的方式进行循环。
for(varindexinmyArray){//不推荐这样
console.log(myArray[index]);
}
for-of循环
数组
for-of循环可以遍历数组等内容
letiterable=[10,20,30];

for(letvalueofiterable){
console.log(value);
}
//10
//20
//30
此时完成了对数组的遍历。
字符串


此时还可以遍历一个字符串
letiterable="boo";

for(letvalueofiterable){
console.log(value);
}
//"b"
//"o"
//"o"
循环一个Map
还可以循环一个Map
letiterable=newMap([["a",1],["b",2],["c",3]]);

for(let[key,value]ofiterable){
console.log(value);
}
//1
//2
//3

for(letentryofiterable){
console.log(entry);
}
//[a,1]
//[b,2]
//[c,3]
循环一个set
还可以循环一个set
letiterable=newSet([1,1,2,2,3,3]);

for(letvalueofiterable){
console.log(value);
}
//1
//2
//3
以上是基本的循环
模块化
对js的模块化进行介绍
以前，js文件在一个文件里，使用js的模块化，可以实现对多个js文件可以进行分离，实现工程化
这里介绍最常用的es6模块化
export与import
这里介绍export和import这两种方式。
文件如下
/*-----export[test.js]-----*/
letmyName="Tom";
letmyAge=20;
letmyfn=function(){
return"Mynameis"+myName+"!I'm'"+myAge+"yearsold."
}
letmyClass=classmyClass{
statica="yeah!";
}
export{myName,myAge,myfn,myClass}

/*-----import[xxx.js]-----*/
import{myName,myAge,myfn,myClass}from"./test.js";
console.log(myfn());//MynameisTom!I'm20yearsold.
console.log(myAge);//20
console.log(myName);//Tom
console.log(myClass.a);//yeah!
这里分为两个文件，分别为test.js和xxx.jstest.js定义了几个变量，并导出了

myName,myAge,myfn,myClass

等，几个变量。
使用import命令，导入了一些变量，进入到命名空间，使用console.log可以进行读取
console.log(myfn());//MynameisTom!I'm20yearsold.
console.log(myAge);//20
console.log(myName);//Tom
console.log(myClass.a);//yeah!
as
as在这里，实现重命名的方式，实现导入的时候，命名的更改。
import{myNameasname1}from"./test1.js";
import{myNameasname2}from"./test2.js";
console.log(name1);//Tom
console.log(name2);//Jerry
这些就完成了基本的导入和导出
以上就是JavaScript几种循环方式以及模块化的总结的详细内容，更多关于JavaScript循环方式以及模块化的资料请关注毛票票其它相关文章！
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

JavaScript 几种循环方式以及模块化的总结

热门推荐

随机推荐