js常用语法系列教程如下
本节教程主要讲解以下几个常用语法
- get \ set 函数
- Map对象
- Set对象
- Super 关键字
get \ set 函数
- get方法(拿取东西的方法)
- set方法(存东西的方法)
class Chef {
constructor(food) {
this.dish = []
}
// 定义一个get方法(拿取东西的方法)
get menu() {
return this.dish
}
// 定义一个set方法(存东西的方法)
set menu(dish) {
this.dish.push(dish)
}
// 添加一个自定义的方法
cook() {
console.log(this.food)
}
}
let wanghao = new Chef('西红柿')
// wanghao.menu = '小炒肉'：调用set防范，往menu中存数据
console.log(wanghao.menu = '小炒肉') // 小炒肉
console.log(wanghao.menu = '番茄鸡蛋') // 番茄鸡蛋
// 调用menu的get方法取数据：wanghao.menu
console.log(wanghao.menu) // ["小炒肉", "番茄鸡蛋"]
Map对象
- new Map()：创建一个map对象
- set()：往map中存数据
- size()：map中的键值对个数
- get()：通过键名获取对应的值
- delete()：删除指定的项
- has()：查看map中是否有某项
- clear()：清空map
// 创建一个Map对象
let food = new Map()
// 把这几个变量表示的东西作为food这个map对象里面的key,也就是这个项目的名字
let fruit = {}, cook = function() {}, dessert = '甜点'
food.set(fruit, '🍐')
food.set(cook, '🍴');
food.set(dessert, '🍩')
console.log(food) // {{…} => "🍐", ƒ => "🍴", "甜点" => "🍩"}
// 知道这个map中有多少个项目(项目就是键值对)的话，可以使用size
console.log(food.size) // 3
// 知道map中项目的名字，我们可以得到对应的值, 使用get()函数
console.log(food.get(fruit)) // 🍐
// 删除项目
food.delete(dessert)
// 查看map中是否有某一个项目
console.log(food.has(dessert)) // false
// 循环处理map中的东西使用
food.forEach((value, key) => {
console.log(`${key} = ${value}`) // [object Object] = 🍐 function cook() {} = 🍴甜点 = 🍩
})
// 清空map
food.clear()
Set 对象
- Set 就是一堆东西的集合，里面的东西不可重复，类似于数组对象
- new Set()：创建一个map对象
- add()：往set中存数据
- size()：set中的键值对个数
- has()：查看set中是否有某项
- delete()：删除指定的项
- clear()：清空set
// 创建一个Set
let desserts = new Set('1', '2', '1')
console.log(desserts)
// 我们可以使用add方法,往Set中添加内容
desserts.add('5')
console.log(desserts)
// 获取Set中内容的个数
console.log(desserts.size)
// 判断Set中是否包含某一个东西
console.log(desserts.has('2'))
// 删除
console.log(desserts.delete('1'))
// 循环处理Set中的数据
desserts.forEach(dessert => {
console.log(dessert)
})
// 清空Set
desserts.clear()
super关键字
let breakfast = {
getDrink() {
return '🍵'
}
}
// let dinner = {
// getDrink() {
// return '🍺'
// }
// }
// 把sunday对象的prototype设置成了breakfast。这样他就拥有了breakfast这个对象中的getDrink()函数。现在想在sunday对象中重新定义getDrink这个方法，去覆盖掉breakfast中的getDrink方法，
// 并且在sunday对象的getDrink中得到breakfast中getDrink返回的值。这样就可以使用super+方法的名字
let sunday = {
__proto__: breakfast,
getDrink() {
return super.getDrink() + '牛奶'
}
}
console.log(sunday.getDrink())
福利时间
