set集合
set的基本操作
let s1 = new Set();
let s2 = new Set(['喜羊羊','美羊羊','懒洋洋','沸羊羊']);
console.log(typeof s1)//object对象
console.log(s2) //{'喜羊羊', '美羊羊', '懒洋洋', '沸羊羊'}
s2.add('灰太狼')
console.log(s2) //{'喜羊羊', '美羊羊', '懒洋洋', '沸羊羊', '灰太狼'}
s2.delete('沸羊羊')
console.log(s2) //{'喜羊羊', '美羊羊', '懒洋洋', '灰太狼'}
console.log(s2.has('灰太狼')) // true
console.log(s2.size) // 4
s2.clear();
console.log(s2) //Set(0) {size: 0}
set集合会自动去重，假如你的set集合中为 let s2 = new Set(['喜羊羊',['喜羊羊']) 当你打印s2的时候集合中只会出现一个‘喜羊羊’，并且set集合的大小也为1。
求两个数组交集
let arr1 = [1,2,3,4,5,4,3,6,9];
let arr2 = [5,3,4,8,3,4,7];
写法一：
let result1 = [...new Set(arr1)].filter(item => {
let s2 = new Set(arr2)
if (s2.has(item)){
return true;
}else {
return false;
}
})
console.log(result1)
写法二
let result2 = [...new Set(arr1)].filter(item => new Set(arr2).has(item));
console.log(result2)
[...new Set(arr1)]是为了将数组去重,再用filter方法判断去重过后的arr2中是否有arr1中有的数字，有就返回，返回的数会保存再result1中。
Map
let m = new Map()
m.set('location','羊村');
m.set('chi',function eat() {
console.log('烤全羊')
})
let key = {
who:'懒洋洋'
}
m.set(key,['羊肉串','清蒸羊肉','羊肉汤'])
console.log(m) // {'location' => '羊村', 'chi' => ƒ, {…} => Array(3)}
console.log(m.size) // 3
m.delete('location')
console.log(m) // {'chi' => ƒ, {…} => Array(3)}
console.log(m.get('todo')) // ['chi', ƒ]
for(let v of m){
console.log(v) //[{…}, Array(3)]
}
m.clear(); // 清空集合 返回undefined
Map是键值对的集合，但是各种类型的值，甚至是对象都可以当作键。同时它也实现了iterator接口，可以使用扩展运算符和for of遍历。
Class类
class phone{
constructor(brand,price) {
this.brand = brand;
this.price = price;
}
call(){
console.log('我可以打电话！！')
}
}
const vivo = new phone('iqoo7',3199);
console.log(vivo) //{brand: 'iqoo7', price: 3199}
call()方法在phone内部
继承
class phone {
constructor(brand,price) {
this.brand = brand;
this.price = price;
}
call(){
console.log('我可以打电话!!')
}
}
class smartPhone extends phone{
constructor(brand,price,color,size) {
super(brand,price);
this.color = color;
this.size = size;
}
game(){
console.log('我可以畅玩各种游戏!!')
}
photo(){
console.log('我的拍照功能很好!!')
}
music(){
console.log('我的音质很棒!!')
}
}
const vivo = new smartPhone('iqoo7',3199,'远峰蓝','300inch')
console.log(vivo)
输出结果：
重写
重写只需要在子类方法中将父类有的方法重新写一下即可。
如图，父类方法中有call方法，我们只需在子类中重写即可。
call(){
console.log('我可以视频通话!!')
}
Getter和Setter
class phone{
get price(){
console.log('价格被读取了')
}
set price(value){
console.log('价格被修改了')
}
}
const p = new phone();
p.price = 'free';
//价格被修改了
模块化方式
优点：
- 防止命名冲突
- 代码复用
- 高维护性
两个命令功能：export，import。
通用方式暴露
第一种暴露及引用方式
//m1.js
export const name = '光头强'
export function tree(){
console.log('光头强又来砍树了');
}
//index.html
<script type="module">
import * as m1 from "./m1.js";
console.log(m1);
</script>
第二种暴露方式
const name = '电击小子'
function hit() {
console.log('火星大力拳')
}
export {name,hit}
第三种暴露方式
export default {
name:'超智能足球',
shoot:function (){
console.log('战车铲球')
}
}
解构赋值形式
<script type="module">
import {name,tree} from "./m1.js"
console.log(name);
console.log(tree);
</script>
简便形式，针对默认暴露(最常用)
<script>
import m3 from "./m3";
console.log(m3);
</script>
把所有方式打包到一个包里
//app.js
import * as m1 from './m1.js'
import * as m2 from './m2.js'
import * as m3 from './m3.js'
console.log(m1)
console.log(m2)
console.log(m3)
//index.html
<script src="app.js" type="module">
</script>
