码迷,mamicode.com
首页 > 其他好文 > 详细

Es6简单介绍(不限于)

时间:2019-10-11 23:26:36      阅读:97      评论:0      收藏:0      [点我收藏+]

标签:介绍   nan   作用域   rap   索引   情况   展开   log   href   

Es6简单介绍(不限于)

一. let、const

    {
        let a = 1
    }
    console.log(a) 
1
2
3
4
var let const
变量声明提升 1.不会提升;
2.只在当前块级作用域生效
1,2同let,
3.已声明的变量不可修改

二. 模板字符串

var str = '字'
var str2 = `模板${str}符串`
console.log(str2) // 模板字符串
1
2
3

三. 解构赋值

let o = {
    a: 1,
    b: 2,
    c: 3
}
const { a, b, c } = o
console.log(a, b, c) // 1, 2, 3
1
2
3
4
5
6
7

这种情况不好理解的话,可以参考下面import用法来理解

test.js

let a = 111, b = [1,2,3], c = function () {}
export {
  a, b, c
}
1
2
3
4

main.js

import { a } from './test.js'
1

四. 展开运算符

基本用法: 将一个变量中的所有元素添加到另一个变量中

var o1 = { a: 1, b:2, c:3}
var o2 = {...o1}
o1 === o2 // false
1
2
3

说明展开运算符可以完成浅拷贝

var o1 = { a: 1, b: 2, c: {d: 4}}
var o2 = {...o1}
o1.a = 11
o1.c.e = 5
console.log(o1) // { a: 11, b: 2, c: {d: 4, e: 5}}
console.log(o2) // { a: 1, b: 2, c: {d: 4, e: 5}}
1
2
3
4
5
6

二级对象中修改就不行了,需要注意

五. 循环

var a = [1,2]
a[4] = null
a[5] = undefined
console.log(a) // [1, 2, empty x 2, null, undefined]

// map
a.map(x => x*2) // [2, 4, empty × 2, 0, NaN]
// 由此了解: '(null相乘为0, undefined相乘NaN, empty相乘无变化)'

// filter
a.filter(x => x*2) // [1, 2]

// reduce,map和filter的结合,功能更强,i是索引,arr就是a
// 可做做累计运算,以下累乘,x初始为a[0],y初始a[1]。
// 第一次循环完了后,x变成了x*y = 2,y = a[2]...
a.reduce( (x, y, i, arr) =>  x*y ) // NaN 

// flat 和filter相似,但是只能过滤empty。
a.flat(x => x*2) // [1, 2, null, undefined]

// flat还可以扁平化数组,但只能有二级数组
[1,2,3,[4,5]].flat() // [1,2,3,4,5]
[1,2,3,[4,5,[6]]].flat() // [1,2,3,4,5,[6]]

// every
[1,2,''].every( x => x) // false

// some
[1,2,''].some( x => x) // true
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

六. async/awit

setTimeout( () => {
  console.log('timeout') 
}, 1000)
console.log('start')
// 先打印哪个,后打印哪个
1
2
3
4
5

原文:大专栏  Es6简单介绍(不限于)


Es6简单介绍(不限于)

标签:介绍   nan   作用域   rap   索引   情况   展开   log   href   

原文地址:https://www.cnblogs.com/wangziqiang123/p/11657486.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!