js基础复习(二)

357 阅读3分钟

1.函数

1.1 参数默认值

1.1.1 ES5函数默认值

function f (x, y, z) {
    if (y === undefined) {
        y = 7
    }
    if (z === undefined) {
        z = 1
    }
    return x + y + z
}

console.log(f(1)) // 9
console.log(f(1, 8)) // 10
console.log(f(1,8,2)) // 11

1.1.2 ES6函数默认值

function f (x, y = 7, z = 1) {
    return x + y + z
}
console.log(f(1)) // 9
console.log(f(1, 8)) // 10
console.log(f(1,8,2)) // 11

但是需要注意的是,ES6中默认值生效的条件是参数值严格等于undefined。
函数参数的默认值还可以是其他参数的运算表达式

function f (x, y = 7, z = x + y) {
    return x + y + z
}

1.2 函数参数的个数

函数中传的参数会体现在arguments中,可以用Array.from转换为数组,然后取length可以拿到函数参数的个数。 ES6中有两种方式获取函数参数个数: (1)函数名.length,不过这个方法只能获取到没有默认值的参数个数 (2)rest: ...num

function f (x, y = 7, z = 1) {
    console.log(f.length) // 1
    return x + y + z
}

把所有参数求和

function f (...num) {
    console.log(num) // 是一个数组
    let sum = 0
    num.map((item) => {
        sum += item
    })
    return sum
}
f(1,2,3) // 6

把第一个参数乘以2,再加上其他参数

function f (base, ...num) {
    console.log(num) // 是一个数组
    let sum = 0
    num.map((item) => {
        sum += item
    })
    return sum + base * 2
}
f(1,2,3) // 7

1.3 rest参数的逆运算

把一个数组里的值分别赋值到函数对应参数位置上
ES5的写法

function sum (a, b, c) {
    return a + b + c
}
let arr = [1, 2, 3]
sum.apply(null, arr)

ES6的写法

function sum (a, b, c) {
    return a + b + c
}
let arr = [1, 2, 3]
sum(...arr)

1.4 箭头函数

let sum = (a, b) => {
    return a + b
}

只有一个参数的时候可以省略小括号。

let sum = a => {
    console.log(a)
}
sum(1)

(1)返回值是表达式,可以省略花括号,也可以省略return (2)返回值是对象,用小括号包起来 (3)其他情况不能省略

let sum = (x, y, z) => x + y + z // 箭头后面是表达式,可以省略花括号和return
let returnObj = (x, y, z) => ({
    x,
    y,
    z
})
returnObj(1, 2, 3)

1.5 箭头函数的this

箭头函数定义的时候,this是什么,执行时this就是什么。

let test = {
    name: 'test',
    say: () => {
        console.log(this.name)
    }
}

test.say() // undefined

2.对象

2.1 对象简写

let x = 1
let y = 2
let obj = {
    x, // 1
    y // 2
}

2.2 属性值支持变量和表达式

let x = 1
let y = 3
let z = 2
let obj = {
    x,
    y,
    [z]: 6,
    [x + y]: 2
}

2.3 值是函数的简写

let obj = {
    hello () {
        console.log(hello)
    }
}

2.4 对象拷贝

let target = {}
let source = {
    a:1
    b:2
}
Object.assign(target, source)

缺陷,Object.assign是浅拷贝。

Object.assign(null, {}) // 报错
Object.assign(undefined, {}) // 报错

Object.assign({}, null) // 没有变化
Object.assign({}, undefined) // 没有变化

3.Set

Set储存的值必须是唯一的。new Set接受的参数是可遍历的数据结构

3.1 增加数据

let s = new Set()
let s2 = new Set([1, 2, 3, 4])

s.add(1) // 存数据
s.add('hello').add('world') // 链式操作

3.2 删除数据

let s = new Set()
s.add(1) // 存数据

s.delete(1) // 删除某一项
s.clear() // 清空全部

3.3 查找数据

let s = new Set()
s.add(1)

s.has(1) // true

3.4 数据长度

let s = new Set([1, 2, 3])
s.size // 3

3.5 遍历

let s = new Set([1, 2, 3])

s.keys() // 返回键值
s.values() // 返回value
s.entries() // key => value

s.forEach((item) => {
    console.log(item) // 分别打印1,2,3
})

for (let value of s) {
    console.log(value) // 分别打印1,2,3
}

我们发现,set本质上还是一个对象

3.6 改

Set没有提供删除api,只能先删掉再添加。

4.Map

4.1 初始化

Map也是通过key-value存储数据,map的key可以是任意值

// 参数必须是一个可遍历对象, 如果是数组会对每一项有要求,每一项还是一个数组,数组第一项是key,第二项是value
let map = new Map([[1, 2], [3, 4]]) 
console.log(map) // Map(2) {1 => 2, 3 => 4}

4.2 增

let map = new Map() // Map(0) {}
map.set(1, 2) // Map(2) {1 => 2}

4.3 改

let map = new Map() // Map(0) {}
map.set(1, 2) // Map(2) {1 => 2}
map.set(1, 3) // Map(2) {1 => 3}

4.4 删

也是有delete和clear两个方法

let map = new Map([[1, 2]]) // Map(2) {1 => 2}
map.delete(1) // Map(0) {}
map.clear()

4.5 数据长度

let map = new Map([[1, 2]]) // Map(2) {1 => 2}
map.size // 1

4.6 查

let map = new Map([[1, 2]]) // Map(2) {1 => 2}
map.has(1) // true
map.has(2) // false

map.get(1) // 2

map.keys()
map.values()
map.entries()

map.forEach((value, key) => {
    console.log(value, key)
})

for (let [key, value] of map) {
    console.log(key, value) // 按照添加顺序遍历
}