建议下一个chrome的插件Scratch.js[https://chrome.google.com/webstore/detail/alploljligeomonipppgaahpkenfnfkn]，可以直接运行ES6～

变量声明

  • let ,let声明的变量拥有 块级作用域
  • const 常量,重新赋值会报错
{

  let a= 2;

  console.log(a) \\2

}

 console.log(a)  \\报错


    let x = 3;

    function func(randomize) {

        if (randomize) {

            let x = Math.random();

            return x;

        }

        return x;

    }

    console.log(func(0)); // 3

    console.log(func(1)); //随机

箭头函数

let arr = [1, 2, 3];

let aqu = arr.map(x => x * x);  //aqu=[1,4,9]

字符串

  • 单字符串模版形势
function printCoord(x, y) {

    console.log(`(${x}, ${y})`);

}

//==>

function printCoord(x, y) {

    console.log("(" + x + ", " + y + ")");

}
  • 字符串 -- 多行字符
const HTML5_SKELETON = `

        <!doctype html>

        <html>

        <head>

            <meta charset="UTF-8">

            <title></title>

        </head>

        <body>

        </body>

        </html>`;

多个返回值，可以同时定义几个变量 超方便

let [, year, month, day] =

        /^(\d{4})-(\d{2})-(\d{2})$/

        .exec('2016-12-31');

//==>

var year = /^(\d{4})-(\d{2})-(\d{2})$/

        .exec('2016-12-31')[1];

循环 for-of

let arr = ['a', 'b', 'c'];

for(let val of arr){

  console.log(val)

}

// 获取index，使用arr.entries() ，先mark 不懂

let arr = ['a', 'b', 'c'];

for(let [i,val] of arr.entries()){

  console.log(`i is ${i}, val is ${val}`)

}

给参数加默认值

function foo(x=1,y=2){

    console.log(x+y)

}

“The spread operator (...)” 跟apply有关

let arr1 = ['a', 'b'];

let arr2 = ['c', 'd'];

arr1.push(...arr2);

//==>

arr1.push.apply(arr1, arr2)
  • arguments
function logAllArguments(...args) {

    for (let arg of args) {

        console.log(arg);

    }

}

//获取第一个之后的参数~

function logAllArguments2(pattern, ...args) {

    console.log(args);

}

对象的写法

let obj = {

  name : 'zhang',

  sayName() {

    console.log(this.name)

  }

};

类

  • 关键字class,
  • constructor定义了该类的构造器函数，
  • 类里面与constructor平行的函数都是在绑定到原型上的


class Person {

    constructor(name) {

        this.name = name;

    }

    describe() {

        return 'Person called '+this.name;

    }

}

// 实例

let student = new Person('xiaozhang');

student.describe();   //Person called xiaozhang"

//==>

function Person(name) {

    this.name = name;

}

Person.prototype.describe = function () {

    return 'Person called '+this.name;

};

继承

  • 关键字 extends
class Employee extends Person {

    constructor(name, title) {

        super(name);

        this.title = title;

    }

    describe() {

        return super.describe() + ' (' + this.title + ')';

    }

}

common.js 文件导入

与es5写法有小小的差别

//------ lib.js ------

export const sqrt = Math.sqrt;

export function square(x) {

    return x * x;

}

export function diag(x, y) {

    return sqrt(square(x) + square(y));

}

//------ main1.js ------

import { square, diag } from 'lib';

console.log(square(11)); // 121

console.log(diag(4, 3)); // 5

//------ main2.js ------

import * as lib from 'lib'; // (A)

console.log(lib.square(11)); // 121

console.log(lib.diag(4, 3)); // 5

参考网址1

ES6初学习的更多相关文章

  1. clisp, scheme 和 clojure 初学习

    clisp, scheme和clojure 初学习 1 clojure "clojure绝对会成为你的编程工具箱里的终极武器" "其他语言可能只是工具,但 Clojure ...

  2. c# window服务-初学习

    window服务-初学习 一.工具: VS2015+NET Framework4.5. 二.操作: 1.新建windows服务的项目: 2.修改windows服务相关内容: 3.预览windows服务 ...

  3. Python初学习:简单的练习题

    Python初学习 一些见到那的练习题: 初级难度 设计一重量转换器,输入以g为单位的数字后,返回换算结果以Kg为单位的结果 中级难度 设计一个求直角三角形斜边长的函数,(以两个直角边为参数,求最长边 ...

  4. ES6深入学习记录(三)编程风格

    今天学习阮一峰ES6编程风格,其中探讨了如何将ES6的新语法,运用到编码实践之中,与传统的JavaScript语法结合在一起,写出合理的.易于阅读和维护的代码. 1.块级作用域 (1)let 取代 v ...

  5. js 模块化的一些理解和es6模块化学习

    模块化 1 IIFE 2 commonjs 3 浏览器中js的模块化 4 简单理解模块加载器的原理  5 es6 之前在参加百度前端技术学院做的小题目的时候,自己写模块的时候 都是写成立即调用表达式( ...

  6. ES6初体验

    开始学习ES6,打算走全栈这条路了,废话不多说,开始吧. 首先安装node环境,去node官网上面下载node最新版本的,我用的系统是window10,所以我只需要下一步下一步就行了,安装完成后打开c ...

  7. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十六 ║Vue基础：ES6初体验 & 模块化编程

    缘起 昨天说到了<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║ Vue前篇:JS对象&字面量&this>,通过总体来看,好像大家对这一块不是很 ...

  8. ES6 语法学习(一)

    1.let 和 const 关键字 let 与 var 的区别有: a.let 声明的变量只在当前的块级作用域内有效(块级作用域通俗的话就是被{}包裹起来的区域声明对象的{}例外). b.let 声明 ...

  9. es6.3学习笔记

    es版本发布相当快,从1.x到2.x,再直接到5.x,6.x 索引这个词在es中有多重意思: 索引(名词):一个索引类似于传统数据库中的一个索引,用于存储关系型文档.索引的复数为indexes或ind ...

随机推荐

  1. python多线程和多进程对比

    1.多线程:开启一个进程test.py ,占用两个cpu  共占用45%左右(top -c ,按1)  多进程:开启两个进程test.py 用两个cpu  90%*2左右 test.py # codi ...

  2. LR12.53—使用HP网络导游示例应用程序

    本教程使用 的HP Web之旅,一个样本的基于Web的旅行社系统,向人们展示LoadRunner将如何作为负载测试解决方案.惠普网络旅游用户连接到Web服务器,搜索航班,预订机票,检查飞行路线. 虽然 ...

  3. 易语言5.6 精简破解版[Ctoo]

    说明:本易语言5.6破解版 加入了[E剑终情]大神制作的完美通杀补丁,本人还修复了静态编译的问题. 关于静态编译失效的问题,大家解压之后会看到易语言根目录有一个"易言语静态编译配置工具&qu ...

  4. 基本变换(读书笔记5 --- Real-Time rendering)

    刚体变换 即变换不改变了被变换顶点之间的距离,以及偏手性(不会让左右手坐标系颠倒). 下面的平移变换.旋转变换即属于刚体变换 平移 从一个位置变到另一个位置可以用平移矩阵T来表示,这个矩阵将一个实体变 ...

  5. 用浏览器模拟各种User Agent

    转至:http://www.cnblogs.com/top5/archive/2012/06/07/2540686.html 测试页面的时候经常需要不同的User Agent,Firefox.Chro ...

  6. <读书笔记> 代码整洁之道

    概述      1.本文档的内容主要来源于书籍<代码整洁之道>作者Robert C.Martin,属于读书笔记. 2.软件质量,不仅依赖于架构和项目管理,而且与代码质量紧密相关,本书提出一 ...

  7. Centos 6.5 下php5.6.2 的编译安装

    纯净的Centos 6.5系统 配置163yum源 (稍后会写一篇文档) 安装  开发软件包:yum  -y groupinstall  "Development Tools" 安 ...

  8. 解决openssl: error while loading shared libraries: libssl.so.1.1: cannot open shared object file: No such file or directory错误

    问题 在Centos7上编译安装openssl后,运行openssl version出现如下错误: openssl: error while loading shared libraries: lib ...

  9. HDOJ（2438）几何里的三分

    Turn the corner http://acm.hdu.edu.cn/showproblem.php?pid=2438 题目:一辆车能否在一个路口拐弯,看图就很明白啦. 算法:见下图,只要求出图 ...

  10. WCF 服务调用 QueryRun

    通过AX2012的WCF服务调用AX2012的方法时,如果方法里调用了QueryRun对象时,会报错,报错信息如下:System.ServiceModel.FaultException: 无法将类型为 ...