ES6初学习
建议下一个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
ES6初学习的更多相关文章
- clisp, scheme 和 clojure 初学习
clisp, scheme和clojure 初学习 1 clojure "clojure绝对会成为你的编程工具箱里的终极武器" "其他语言可能只是工具,但 Clojure ...
- c# window服务-初学习
window服务-初学习 一.工具: VS2015+NET Framework4.5. 二.操作: 1.新建windows服务的项目: 2.修改windows服务相关内容: 3.预览windows服务 ...
- Python初学习:简单的练习题
Python初学习 一些见到那的练习题: 初级难度 设计一重量转换器,输入以g为单位的数字后,返回换算结果以Kg为单位的结果 中级难度 设计一个求直角三角形斜边长的函数,(以两个直角边为参数,求最长边 ...
- ES6深入学习记录(三)编程风格
今天学习阮一峰ES6编程风格,其中探讨了如何将ES6的新语法,运用到编码实践之中,与传统的JavaScript语法结合在一起,写出合理的.易于阅读和维护的代码. 1.块级作用域 (1)let 取代 v ...
- js 模块化的一些理解和es6模块化学习
模块化 1 IIFE 2 commonjs 3 浏览器中js的模块化 4 简单理解模块加载器的原理 5 es6 之前在参加百度前端技术学院做的小题目的时候,自己写模块的时候 都是写成立即调用表达式( ...
- ES6初体验
开始学习ES6,打算走全栈这条路了,废话不多说,开始吧. 首先安装node环境,去node官网上面下载node最新版本的,我用的系统是window10,所以我只需要下一步下一步就行了,安装完成后打开c ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十六 ║Vue基础：ES6初体验 & 模块化编程
缘起 昨天说到了<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║ Vue前篇:JS对象&字面量&this>,通过总体来看,好像大家对这一块不是很 ...
- ES6 语法学习(一)
1.let 和 const 关键字 let 与 var 的区别有: a.let 声明的变量只在当前的块级作用域内有效(块级作用域通俗的话就是被{}包裹起来的区域声明对象的{}例外). b.let 声明 ...
- es6.3学习笔记
es版本发布相当快,从1.x到2.x,再直接到5.x,6.x 索引这个词在es中有多重意思: 索引(名词):一个索引类似于传统数据库中的一个索引,用于存储关系型文档.索引的复数为indexes或ind ...
随机推荐
- python Django教程 之 安装、基本命令、视图与网站
python Django教程 之 安装.基本命令.视图与网站 一.简介 Django 中提供了开发网站经常用到的模块,常见的代码都为你写好了,通过减少重复的代码,Django 使你能够专注于 w ...
- 利用Flex组件birdeye绘制拓扑关系图
birdeye绘制拓扑关系图 1.flex简单介绍 Flex 是一个高效.免费的开源框架,可用于构建具有表现力的 Web应用程序,这些应用程序利用Adobe Flash Player和Adobe AI ...
- wordpress stratus模板使用 产品显示问题
产品不显示,只显示展示产品代码. 1.研究原站demo,思考产品展示调用自woocommerce. 2.查看woocommerce文档,更新展示代码. 3.修改后产品出现,但是多余的关联推荐也展示出来 ...
- 【ORM】--FluentNHibernate之AutoMapping详解
上篇文章详细讨论了FluentNHibernate的基本映射的使用方法,它的映射基本用法是跟NHibernate完全一样的,首先要创建数据库链接配置文件,然后编写Table的Mappin ...
- JQuery 插件之Ajax Autocomplete（ajax自动完成）搜索引擎自动显示下拉框
平时用百度,谷歌搜索的时候 会有一个下 拉列表进行提示 这是一个非常好的功能 本文要介绍的这个JQuery 插件 名叫Ajax Autocomplete 顾名思义 ajax 也就是用ajax的方式获取 ...
- JAVA EE中session的理解
转自[互动百科]http://www.baike.com/wiki/Session Session Session:在计算机中,尤其是在网络应用中,称为“会话”.Session直接翻译成中文比较困 ...
- NRF51822之IIC(MEMS_LIS2DH12)
在上篇介绍了OLED的II以写操作为主,没有进行读取操作.所以在现再补充读取的操作. 我在此以LIS2DH为例子 uint8_t temp; lis2dh_read_registers(LIS2DH_ ...
- RichEdit 追加 RTF
下面实现追加RTF 到 RichEdit 的功能其本质是:EM_STREAMIN 消息,详细查看 MSDN//--------------------------------------------- ...
- Linux踢出其他正在SSH登陆用户
1.查看系统在线用户 [root@testdb ~]#w 2.查看哪个属于此时自己的终端(我开了两个连接) [root@testdb ~]# who am i 3.pkill掉自己不适用的终端 [ro ...
- c++中resize函数怎么用
resize(),设置大小(size);reserve(),设置容量(capacity);size()是分配容器的内存大小,而capacity()只是设置容器容量大小,但并没有真正分配内存.打个比方: ...