javascript es6 语法快速入门

1. let、const

　　作用：let 声明变量，const 声明常量

　　与 var 的区别：不能重复声明，且存在块级作用域，即只在代码块内生效

2. 箭头函数

　　使用：

let show = function (a, b) {
    return a + b;
}
alert(show(5, 3))　　//结果为8

let show = (a, b) => {
    return a + b;
}
alert(show(5, 3))　　//结果为8

　　当函数只有一个参数时，可以省略圆括号；当函数体内只有一条return语句时，可以省略函数体

let score = [19, 78, 90, 32, 12, 88]
let r = score.map(item => item >= 60 ? '及格' : '不及格')
alert(r)

3. 参数扩展：多余的参数可以通过扩展参数接收

let show = function (a, b, ...args) {
    alert(a)
    alert(b)
    alert(args)
}
show(1, 2, 3, 4, 5, 6, 7, 8, 9);

let arr1 = [1, 2, 3]
let arr2 = [4, 5, 6]
let arr = [...arr1, ...arr2]
alert(arr)

4. 解构赋值：左右两边类型必须一致

let [a, b, c] = [1, 2, 3]
console.log(a, b, c)　　//结果为：1,2,3

let { a, b, c } = {
    a: 123,
    b: 324,
    c: 54343
}
console.log(a, b, c);

5. 数组

　　5.1 map （映射）

let arr = [12, 5, 8]

let result = arr.map(
    (item) => {
    return item * 2;
    }
)

alert(result)　　//结果为24,5,16

　　5.2 reduce（汇总）

let arr = [1, 2, 3, 4, 5, 6]
let r = arr.reduce((tmp, item, index) => {
    return tmp + item;
})
alert(r)    //结果为21

let arr = [1, 2, 3, 4, 5, 6]
let r = arr.reduce((tmp, item, index) => {
    if (index != arr.length - 1) {
        return tmp + item;
    } else {
        return (tmp + item) / arr.length
    }
})
alert(r)

　　5.3 filter（过滤器）

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]
let r = arr.filter(item => {
    return item % 3 == 0
})

alert(r)    //结果为3，6，9

　　5.4 forEach（迭代）

let arr = [12, 5, 8, 9]

arr.forEach(item => {
    alert(item)
})

6. 字符串

　　1. startsWith、endsWith：匹配开头和结尾的字符串

let str = "http://xxxxx.jpg"

if (str.startsWith('http')) {
    alert("ok")
} else {
    alert("no")
}

if (str.endsWith('jpg')) {
    alert("ok")
} else {
    alert("no")
}

　　2. 字符串模板：支持换行且可以使用 "${ }" 符取值

let title = 'Welcome!'
let content = 'hello es6!'
let str = `
    <div>
    <h1>${title}</h1>
    <p>${content}</p>
    </div>
`
alert(str)

巴特西

javascript es6 语法快速入门

最新文章

热门文章