转载链接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/es6-grammar-part-one/

一、let命令

基本用法:ES6新增了let命令,用来声明变量。用法与var类似,但是let命令只在代码块内有效

example: { let a=10;

var b=1;

}

a // ReferenceError:a is not defined

b:// 1

1.1 let不存在变量的提升:let不会像var那样发生'变量提升'的现象,变量一定要在声明后使用,否则会报错(我理解的就是var 值所以不会报错,是因为初始值就是undefined)

1.2 let不允许在相同的作用域内重复声明同一个变量

二、const命令

const也是用来声明变量,但是声明的是常量。一旦声明,常量值就不可以改变。用法跟其他语言(java,c,c++)一样

三、跨模块常量

const命令声明的常量只在当前的代码块有效,如果我们想设置跨模块常量,那就需要采用下面的写法了

// first.js

export const a=1;

export const b=3;

export const c=4;

//second.js

import * as first from './first'

console.log(first.a);  // 1

console.log(first.b);   // 3

//third.js

import {a,b}from './first'

console.log(first.a);  // 1

console.log(first.b);  // 3

四、Module

4.1export命令:

模块功能主要有两个命令构成:export和import。export用于规定模块的对外接口,import命令用于

输入其他模块提供的功能

一个模块就是一个独立的文件。文件内部的东西,外面是无法获取的。如果你想你想读取模块的某个变量,就需要export出来改变量

example:   //example.js

export var firstname='Jane';

export var lastname='zhou'

另一种export的写法

var firstname='jane';

var lastname='zhou'

export {firstname.lastname}; 建议用第二种写法,一目了然。

export命令除了输出变量外,还可以输出函数或者类(Class)

export function multiply (x,y){

return x*y;

}

注意:export 命令可以出现在模块的任何的位置,只要处于模块的顶层就可以。如果处于块级作用

域,就会报错(import)命令也是如此。因为处于代码块之中就没法做静态优化了,这样违背了ES6

设计的初衷。

4.2 import命令:

使用export命令定义对外的接口,其他js文件可以通过import命令来加载这个模块。

//main.js

import {firstname,lastname} from example.js

ES6语法篇(其一)的更多相关文章

  1. ES6语法知识

    let/const(常用) let,const用于声明变量,用来替代老语法的var关键字,与var不同的是,let/const会创建一个块级作用域(通俗讲就是一个花括号内是一个新的作用域) 这里外部的 ...

  2. 一些基础的ES6 语法

    <script> window.onload = function () { //---------------------------let----------------------- ...

  3. gulp打包js多个文件夹并压缩混淆,编译ES6语法,及多个import依赖由一个入口打包成一个cdn

    感觉和webpack的步骤差不多 首先安装gulp:参考上一篇 安装完之后 新建一个文件目录起名 在当前目录下打开cmd 执行:npm init 创建package.json文件 然后安装第一个插件g ...

  4. es6语法重构react代码

    1.使用React.Component创建组件,需要通过在constructor中调用super()将props传递给React.Component.另外react 0.13之后props必须是不可变 ...

  5. vue 2.0 无法编译ES6语法

    # vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...

  6. Flex 布局:语法篇

    网页布局(layout)是 CSS 的一个重点应用.布局的传统解决方案,基于盒状模型,依赖 display 属性 + position 属性 + float 属性.它对于那些特殊布局非常不方便,比如, ...

  7. 把JavaScript代码改成ES6语法不完全指南

    目录 * 核心例子 * 修改成静态变量(const)或块级变量(let) * 开始修改 * 疑问解释(重复定义会发生什么) * 疑问解释(let的块级作用域是怎样的) * 疑问解释(const定义的变 ...

  8. 让intellij idea 14 支持ES6语法

    用eclipse做前端开发,用到了webpack,结果各种依赖导致软件卡的一比,简直不能动!虽然在同事的帮忙下,修改了一下配置,但仍然卡的没脾气.改用intellij idea 14解决了卡的问题,但 ...

  9. .vue文件在webstorm中es6语法报错解决方法

    1 语法支持es6设置 Preferences > Languages & Frameworks > JavaScript 把 Javascript Language versio ...

随机推荐

  1. swift的一些知识点(不断完善中)

    首先,隆重推荐文章http://www.infoq.com/cn/articles/swift-brain-gym-optional swift 烧脑体操!目前有4篇文章,说的都很好! 1. 应该充分 ...

  2. JavaScript 使用 mediaDevices API 选择摄像头

    大多数智能手机都有前置和后置摄像头,当你在创建视频应用时你可能想要选择或者切换前置.后置摄像头. 如果你开发的是一款聊天应用,你很可能会想调用前置摄像头,但如果你开发的是一款拍照软件,那么你会更倾向于 ...

  3. Python 列表推导、迭代器与生成器

    1.列表推导 1 2 3 4 5 6 7 8 9 10 11 numbers = [i for i in range(10) if i % 2 == 0] print(numbers)   seq = ...

  4. python 全栈开发,Day137(爬虫系列之第4章-scrapy框架)

    一.scrapy框架简介 1. 介绍 Scrapy一个开源和协作的框架,其最初是为了页面抓取 (更确切来说, 网络抓取 )所设计的,使用它可以以快速.简单.可扩展的方式从网站中提取所需的数据.但目前S ...

  5. HDU1850 尼姆博弈求可行方案数目

    尼姆博弈(Nimm's Game) 题型 尼姆博弈模型,大致上是这样的: 有3堆各若干个物品,两个人轮流从某一堆取任意多的物品,规定每次至少取1个,多者不限,最后取光者得胜. 分析 1.首先自己想一下 ...

  6. oracle表分区创建

    一.什么是分区表表分区有以下优点: 1.数据查询:数据被存储到多个文件上,减少了I/O负载,查询速度提高. 2.数据修剪:保存历史数据非常的理想. 3.备份:将大表的数据分成多个文件,方便备份和恢复. ...

  7. A. 【UR #17】滑稽树上滑稽果

    题解: 首先很显然的是这是一条链(特殊数据说是链是故意让人迷茫的??) 然后 自己就开始yy 觉得每一次是加入一个使得当前值最小的数 然而这tm又是特殊数据?? 那就写一波发现是错的 考虑一下特殊数据 ...

  8. [ZJOI2012]旅游

    题目: 这题意...还以为他说的线段是路径 写了好久的dp..写不出来 看了网上的题解..才知道就是两点连线 然后就是一般的平面图转对偶图的思想 然后算一下边数发现是颗树,求一下直径就好了 代码: # ...

  9. mybatis的sqlSessionFactory的加载过程

    使用过SSM的框架的都知道mybatis这个持久层框架,今天小编就来简单说说这个框架的核心工厂类sqlSessionFactory的加载过程,一般的SSM框架我们都会在spring的applicati ...

  10. php中$this->是什么意思

    $this 的含义是表示    实例化后的 具体对象! 我们一般是先声明一个类,然后用这个类去实例化对象! 但是,当我们在声明这个类的时候,想在类本身内部使用本类的属性或者方法.应该怎么表示呢? 例如 ...