es6

by 郭 凡

Babel + JSX

//let const变量声明
let a = 1;
const A = 2;

//模板字符串
const name = "Jarvis";
const template = `My name is ${name}`;
alert(template);

//属性名表达式
let propKey = 'foo';

let objs = {
  [propKey]: true,
  ['a' + 'bc']: 123
};

//箭头函数
let names = [ 'Will', 'Jack', 'Peter', 'Steve', 'John', 'Hugo', 'Mike' ]
let newSet = names
  .map((name, index) => {
    return {
      id: index,
      name: name
    }
  })
  .filter(man => man.id % 2 == 0)
  .map(man => [man.name])
  .reduce((a, b) => a.concat(b))
 
console.log(newSet) //=> [ 'Will', 'Peter', 'John', 'Mike' ]
let hello = 'es6';
let bar = () => {
	return 12313
};
let obj = {
	hello : 'world',
  foo() {
  	console.log(this.name)
  },
  name : 'guofan'
};
console.log(obj.name);
console.log(bar());

function arrowChain() {
	return a=>b=>{
  	alert(a+b);
  }
}
arrowChain()(1)(2);
//类
class Person {
  constructor(name, gender, age) {
    this.name = name
    this.gender = gender
    this.age = age
  }
 
  isAdult() {
    return this.age >= 18
  }
}
 
let me = new Person('iwillwen', 'man', 19)
console.log(me.isAdult()) //=> true

//扩展
let state = {
	name : 'fancy',
  age : 17,
  sex : 'male'
};
let newData = {
	name : 'guofan',
  province : '湖北',
  job : 'IT'
};
let spreadExpress = { ...state, ...newData };
console.log(`%c spreadExpress`, `color:#f00`, spreadExpress);