盒子模型
对于非替换的行内元素来说，尽管内容周围存在内边距与边框，但其占用空间（行高）由 line-height
属性决定
box-sizing 属性用于更改用于计算元素宽度和高度的默认的 CSS 盒子模型。可以使用此属性来模拟不正确支持CSS盒子模型规范的浏览器的行为。
content-box：默认值，标准盒子模型。width = 内容的宽度，height = 内容的高度。
border-box：width = border + padding + 内容的 width，height = border + padding + 内容的 height。
es6新特性
ES6常用语法整合
Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。这意味着，你可以现在就用ES6编写程序，而不用担心现有环境是否支持。
class
class Cons{
constructor(name, age) {
this.name = name
this.age = age
}
getMes() {
console.log(`hello ${this.name} !`);
}
}
let mesge = new Cons('ashin', 3)
mesge.getMes()
class Ctrn extends Cons {
constructor(name, anu) {
super(name)
this.anu = anu
}
ingo() {
console.log(`${this.name} & ${this.anu}`);
}
}
let ster = new Ctrn('ashin', 3)
ster.getMes()
ster.ingo()
箭头操作符
var arr = [1,2,3]
arr.forEach(x=>console.log(x))
解构赋值
数组中的值会自动被解析到对应接收该值的变量中
var [name,,age] = ['a', 'b', 3]
console.log(name + age);
默认参数
定义函数的时候指定参数的默认值
// es5
function fn(name) {
var name = name || 'a'
console.log(name);
}
fn()//a
// es6
function fn(name='b') {
console.log(name);
}
fn()//b
多行字符串
使用反引号`来创建字符串
//ES5
var str = 'The 3.1 work extends XPath and'
+'XQuery with map and array data structures'
+'along with additional functions and operators'
+'for manipulating them; a primary motivation'
+'was to enhance JSON support.';
//ES6
var roadPoem = `The 3.1 work extends XPath and
XQuery with map and array data structures
along with additional functions and operators
for manipulating them; a primary motivation
was to enhance JSON support.`;
字符串模版
由美元符号加花括号包裹的变量${name}
var name = 'will';
console.log(`my name is ${name}`);
扩展运算符
// es5
function add() {
var arr = Array.prototype.slice.call(arguments)
console.log(arr.reduce((x,y)=>x+y));
}
add(1,2,3)
// es6
function add(...args) {
console.log(args.reduce((x,y)=>x+y));
}
add(1,2,3)
块级作用域
let与const 关键字！可以把let看成var，它定义的变量被限定在了特定范围内。const则用来定义常量，即无法被更改值的变量。共同点都是块级作用域。
//let
for (let i=0;i<2;i++){
console.log(i);//输出: 0,1
}
console.log(i);//输出：0?
//const
const name='a';
name='b'; //报错
模块
// b.js
function fn(){
console.log('hello world');
}
export fn;
// a.js
module { fn } from "./b";
fn();
// 然后在HTML引入a文件运行
for of
我们都知道for in循环用于遍历数组，类数组或对象，ES6中新引入的for of循环功能相似，不同的是每次循环它提供的不是序号而是值。
var a = ['a', 'b', 'c']
for(x in a) {
console.log(x);
} // 0 1 2
for(x of a) {
console.log(x);
} // a b c
构造函数继承
Cat.prototype = new Animal();
Cat.prototype.constructor = Cat;
非构造函数继承
function object(o) {
function F() {}
F.prototype = o;
return new F();
}
JavaScript 继承简单理解与实现
JavaScript 原型理解与创建对象应用
事件捕获事件冒泡事件代理
JavaScript 详说事件机制之冒泡、捕获、传播、委托
javascript 有没有更高效的事件绑定写法？
clone: Object.create(obj)
http://www.cnblogs.com/yugege/p/6526215.html
