Skip to main content

Javascript教程第七章:Map类型

Javascript 教程第七章:Map 类型

传统的对象只能使用字符串作为键名,新增的 Map 可以用所有基本数据类型作为键名.

一.Map 类型

1.Map 类型特点以及创建方式

  • 传统的对象只能使用字符串作为键名

  • 新增的 Map 可以用所有基本数据类型作为键名

    1.增

map.set("name","Tsy")
let map = new Map(["name1","Tsy"],["name2","Tly"])

2.删

map.delete()
map.clear()

3.改

map.set()           同一键名多次set

4.查

map.has(keyword)

5.遍历

map.keys()
map.values()
map.entries()
forof或者forEach(value,key)进行遍历

2.类型转换

使用展开语法转换为数组

3.Map 类型管理 DOM 节点

Map 类型可以保存多种数据类型,因此可以直接将 DOM 元素保存在我们的 Map 之中

4.使用 Map 类型控制网站表单提交

<form action="" onsubmit="return post()">
账号: <input type="text" name="username" data_error="请输入账号" ><br>

密码: <input type="password" name="psw" data_error="请输入密码" ><br>

接收协议 <input type="checkbox" name="agreement" data_error="请阅读协议"><br>

<input type="submit">
</form>
function post(){
let map = new Map()
let inputs = document.querySelectorAll("[data_error]")
inputs.forEach(item=>{
map.set(item,{
error:item.getAttribute("data_error"),
status:item.checked,
})
})

return [...map].every(([ele,config]) => {
config.status || alert(config.error)
})

return false;
}

5.WeakMap 的语法使用

WeakMap 中的键只能是对象,引用类型,并且同 WeakSet 一样,Map 的迭代方法同样不适用 因为弱引用类型的特性(不会是引用对象的引用次数加一,在引用对象被删除后,不会通知弱引用类型的数据结构,所以 WeakMap 会默认引用类型的值仍然存在),所以弱引用类型不会提供迭代方法,因为这样获取的值可能已经被删除

6.使用 WeakMap 开发选课组件