beace 发布于 02月21, 2017

ECMAScript 2015 Features-c10-subclassed

ECMAScript 2015 Features

Subclassed

在ES6中,Array,Date,DOM元素都可以被继承子类化。

class MyArray extends Array {
  constructor(...args) {
    super(...args);
  }
}

var myarr = new MyArray();
myarr[0] = 1;
console.log(myarr, myarr.length); //MyArray [ 1 ] 1
}

阅读全文 »

beace 发布于 02月21, 2017

ECMAScript 2015 Features-c08-set-map

ECMAScript 2015 Features

Set && Map

高效的数据结构。

写法

  • Set
var s = new Set();
s.add('a').add('b').add('c');
s.has('a'); //true
s.has(a); // ReferenceError: a is not defined
  • Map
var m = new Map();
m.set("abc", 123); // Map { 'abc' => 123 }
m.get('abc') // 123
m.set(a, 1); //ReferenceError: a is not defined
m.set(s, 22); // Map { 'abc' => 123, Set { 'a', 'b', 'c' } => 22 }

阅读全文 »

beace 发布于 02月21, 2017

ECMAScript 2015 Features-c07-modules

ECMAScript 2015 Features

Modules

JavaScript遵循着两种比较流行的模块加载器——AMDCommonJS模式。在未引用该模块之前,该模块不执行,知道被import

写法

//utils.js
export function sum(x, y) {
  return x + y;
}
export const pi = Math.PI;
//app.js
import {sum, pi} from "./utils/js";
console.log(sum(pi + pi)); //6.283185307179586

OR

//app.js
import * as Utils from "./utils.js";
console.log(Utils.sum(Utils.pi + Utils.pi)); ////6.283185307179586

阅读全文 »

beace 发布于 02月21, 2017

ECMAScript 2015 Features-c04-destructuring

ECMAScript 2015 Features

Destructuring

解构允许模式匹配。所谓的模式匹配,简单来讲只不过是同时赋值多个变量,并且可以预赋值。这种解构方式同时支持ArrayObject

特点

  • 可以同时赋值多个变量,若变量与值不匹配,则赋值为undefined
  • 变量预赋值(在形参中体现较多)

写法

数组

  • 赋值
const [a, b] = [1, 2];
const [c, , d] = [3, 4, 5];
const [e, f, g] = [6, 7];
console.log(a, b, c, d, e, f, g); //1 2 3 5 6 7 undefined
  • 预赋值
let [a = 1] = [];
console.log(a);  // 1
a = 2;
console.log(a);  // 2

Object

  • 属性赋值
function g({name: x}) {
  console.log(x);
}
g({name: 5}) // 5
  • 预赋值
function f({a, b, c = 1, d = 2}) {
  return a + b + c + d;
}
f({a: 2, b: 2}) // 7

Tips

function f(x, y, z) {
  return x + y + z;
}
f(...[1,2,3]); //6
f(...[1, 2]) //NaN
let arr = [1,2,5];
f(...arr); // 8

阅读全文 »

beace 发布于 02月21, 2017

ECMAScript 2015 Features-c03-string-tpl

ECMAScript 2015 Features

Template Strings

字符串模板是用来构建字符串,并且可以在字符串中添加变量、表达式的语法糖。写法与Scala Playframework中的字符串拼接及其相似。

特点

  • 方便的拼接字符串
  • 提供字符串中添加变量、表达式等

写法

const GREETING = "Hello";

let sayHello = `${GREETING}, baby!`
let sayTime = `${GREETING}, the time is ${Date.now()}`
console.log(sayHello); // Hello, baby
console.log(sayTime);  // Hello, the time is Fri Feb 17 2017 13:38:49 GMT+0800 (CST)

Scala

Scala Playframework中的字符串拼接

val str = s"fasf${fda}"

阅读全文 »

beace 发布于 02月21, 2017

ECMAScript 2015 Features-c02-class-suger

ECMAScript 2015 Features

class

ES6中的class关键字是JavaScript实现面向对象语法的一种语法糖。这种模式,或者说方式对于繁琐的原型继承以及对象字面量的表达方式有了更进一步的语义上的成熟。class关键字在java,scala面向对象的语言中,运用的很成熟。不可否认,ECMAScript标准的制定者有意向这方面靠近。

特点

  • 写法更贴近经典面向对象的写法
  • constructor
  • super
  • static method
  • extends

写法

class User {
  constructor(sex) {
    this.friends = [];
    this.sex = sex || '男';
  }

  getSex() {
    console.log('性别:', this.sex);
  }

  static method() {
    console.log('this is a static method!');
  }
}
var user = new User("女");
user.getSex(); //性别: 女
User.method(); //this is a static method!

阅读全文 »

beace 发布于 02月19, 2017

我为什么离职

有很长时间没有写文章了,包括年前和年后。原因主要是在忙离职之前和找工作的事情。大概年前半个月萌生了这个想法,然后不断的寻找挑选合适的企业,直到这周才尘埃落定。

阅读全文 »