欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 汽车 > 新车 > ES6相关操作(2)

ES6相关操作(2)

2025/2/23 18:07:30 来源:https://blog.csdn.net/2201_75355888/article/details/145738196  浏览:    关键词:ES6相关操作(2)

一.Promise

        Promise是ES6引入的异步编程工具。

        语法上Promise是一个构造函数,用于封装异步操作并可以获取操作成功或失败的结果

        Promise构造函数:Promise(excutor){}

        Promise的常用函数:then,catch

        实例化Promise对象(创建Promise工具)

            let data="请求数据"//该数据为服务器的数据

            reject(data)

         })

        调用Promise的then方法

        p.then(function(value){

        编写响应值

         })

二.集合

什么是集合:用于存放很多数据的容器,在集合中提供了大量的功能方法,可以快速的操作数据

        1.Set集合:成员的值必须是唯一的,实现了iterator(迭代器)的接口,可以使用for......of...... 等进行遍历

        集合中常用功能方法:size-返回集合元素的个数,add向集合中添加数据,delete-删除数据,返回的是boolean(布尔类型的值)。has检查集合中是否包含某个元素

        声明Set集合

        2.Map集合:

        Map集合:以键值对的方式存储数据

                常用的属性和方法:

                        size 元素的个数

                        set 增加数据

                        get根据键获取数据

                        has 判断是否包含

                        clear 清空,undefined

        

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>集合</title>
</head>
<body><script>//什么是集合:用于存放很多数据的容器,在集合中提供了大量的功能方法,可以快速的操作数据//Set集合:成员的值必须是唯一的,实现了iterator(迭代器)的接口,可以使用for......of......等进行遍历//集合中常用功能方法:size-返回集合元素的个数,add向集合中添加数据,delete-删除数据,返回的是boolean(布尔类型的值)。has检查集合中是否包含某个元素//声明Set集合let s1 =new Set();let s2=new Set(['小沈阳','赵四','刘能','宋小宝'])console.log(s2)//获得集合元素的个数console.log(s2.size)//添加元素s2.add('赵本山')console.log(s2)//删除元素s2.delete('小沈阳')//set集合值唯一s2.add('赵四')//元素检查是否存在let a=s2.has('刘能')console.log(a)//清空s2.clear()console.log(s2)//Map集合:以键值对的方式存储数据/*常用的属性和方法:size 元素的个数set 增加数据get根据键获取数据has 判断是否包含clear 清空,undefined*///声明Map集合let m=new Map()//添加数据m.set('name','刘德华')m.set('message',function(){console.log('演员,歌手')})let key={sayHi:'我的能力有'}m.set(key,['唱歌','跳舞','演员'])//获取元素个数console.log(m.size)console.log(m)//获得数据console.log(m.get('name'))//删除数据m.delete('name')//清空数据m.clear()console.log(m)</script>
</body>
</html>

三.模块化

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>模块化</title>
</head>
<body><script type="module">//模块化//将一个大的程序文件拆分许多小的文件,将小的文件组合起来实现业务功能//模块化的好处://1.防止命名冲突//2.代码复用//3.高维护//模块化的命令//export 用于规定模块化对外接口//import 用于导入其他模块化提供的功能//引入m1.js模块内容// import *as m1 from "./m1.js"// console.log(m1)//import * as m2 from 'm2.js'// import * as m3 from 'm3.js'//m3.goodsMessage() //2.解构模块数据// import {goods,goodsMessage} from "m1.js"// console.log(m1)// import {goods as g,goodsMessage as gm} from "m2.js"// import {default as m3} from "m3.js"//3.简化写法// import m3 from "m3.js"</script><script type="module" src="./app.js"></script>
</body>
</html>

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

热搜词