您的当前位置:首页正文

es6的class 类

2024-11-06 来源:个人技术集锦

概述:
ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合。但是“键”的范围不限于字符串,各
种类型的值(包括对象)都可以当作键。Map 也实现了 iterator 接口,所以可以使用『扩展运算符』
和『for…of…』进行遍历;
Map 的属性和方法:
1. size 返回 Map 的元素个数;
2. set 增加一个新元素,返回当前 Map;
3. get 返回键名对象的键值;
4. has 检测 Map 中是否包含某个元素,返回 boolean 值;
5. clear 清空集合,返回 undefined;
简单使用:
代码实现:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Map 集合</title>
</head>
<body>
<script>
// Map 集合
// 创建一个空 map
let m = new Map();
// 创建一个非空 map
let m2 = new Map([
['name', '大喇叭'],
['slogon', '只有掌握真正的技术,才能拥有永远的财富']
]);
// 1. size 返回 Map 的元素个数;
console.log(m2.size);
// 2. set 增加一个新元素,返回当前 Map;
m.set("皇帝", "大哥");
m.set("丞相", "二哥");
console.log(m);
// 3. get 返回键名对象的键值;
console.log(m.get("皇帝"));
// 4. has 检测 Map 中是否包含某个元素,返回 boolean 值;
console.log(m.has("皇帝"));
// 5. clear 清空集合,返回 undefined;
m.clear();
console.log(m);
</script>
</body>
</html>

运行结果:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>class 静态成员</title>
</head>
<body>
<script>
// class 静态成员
// ES5 写法
// function Phone() {}
// Phone.name = "手机";
// Phone.change = function () {
// console.log("我可以改变世界!");
// }
// let nokia = new Phone();
// console.log(nokia.name); // undefined
// // nokia.change();
// // 报错:Uncaught TypeError: nokia.change is not a function
// Phone.prototype.color = "黑色";
// console.log(nokia.color); // 黑色
// console.log(Phone.name);
// Phone.change();
// 注意:实例对象和函数对象的属性是不相通的
// ES6 写法
class Phone {
// 静态属性
static name = "手机";
static change() {
console.log("我可以改变世界!");
}
}
let nokia = new Phone();
console.log(nokia.name);
console.log(Phone.name);
Phone.change();
</script>
</body>
</html>

运行结果:

Top