ES6常用语法

var 

        var name = "woniu"

        { 
            var name = 'imooc'
        }
        console.log(name) //imooc

let 块级作用域

        {
            let name = 'imooc'
        }
        console.log(name) //imooc   let是块级作用域,只有在括号内部才可以获取到,外部是获取不到的

const 块级作用域  用处当我们很多人协作开发一个项目的时候,希望一个变量不会被修改,在性能上也有提升

const lang = 'vue.js';
lang = 'react'  //const的值不可修改,这样写会报错   

//正确写法
let lang = 'vue.js';
lang = 'react';  //这里用Let就不会报错

import(导入)如何正确的使用花括号‘{}’、export default 、export(导出)

假如有一个B.js,想要通过import语法引用模块A.js,那么可以这么写:

// B.js
import A from './A'

而上面的代码生效的前提是,只有在如下A.js中有默认导出export default语法时才会生效。也就是:

// A.js
export default 42
在这种不使用 {} 来引用模块的情况下, import 模块时的命名是随意的,即如下三种引用命名都是正确的:
// B.js
import A from './A'
import MyA from './A'
import Something from './A'

因为它总是会解析到A.js中默认的export default

微笑而下面是使用了花括号命名的方式{A}来导入A.js

import { A } from './A'

上面代码生效的前提是,只有在模块A.js中有如下命名导出Aexport name的代码,也就是:

export const A = 42

而且,在明确声明了命名导出后,那么在另一个js中使用{}引用模块时,import时的模块命名是有意义的,如下:

// B.js
import { A } from './A'                 // 正确,因为A.js中有命名为A的export
import { myA } from './A'               // 错误!因为A.js中没有命名为myA的export
import { Something } from './A'         // 错误!因为A.js中没有命名为Something的export

要想上述代码正确执行,你需要明确声明每一个命名导出:

// A.js
export const A = 42
export const myA = 43
export const Something = 44

ps: 一个模块中只能有一个默认导出export default,但是却可以有任意命名导出(0个、1个、多个),你也可以如下,一次性将他们导入:

// B.js
import A, { myA, Something } from './A'

这里我们使用导入默认导出A,以及命名导出myASomething

我们甚至可以在导入的时候重命名导入:

import X, { myA as myX, Something as XSomething } from './A'

总结:模块的默认导出通常是用在你期望该从模块中获取到任何想要的内容;而命名导出则是用于一些有用的公共方法,但是这些方法并不总是必要的。




  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值