盒子模型
對于非替換的行內(nèi)元素來說，盡管內(nèi)容周圍存在內(nèi)邊距與邊框，但其占用空間（行高）由 line-height
屬性決定
box-sizing 屬性用于更改用于計算元素寬度和高度的默認的 CSS 盒子模型?？梢允褂么藢傩詠砟M不正確支持CSS盒子模型規(guī)范的瀏覽器的行為。
content-box：默認值，標(biāo)準(zhǔn)盒子模型。width = 內(nèi)容的寬度，height = 內(nèi)容的高度。
border-box：width = border + padding + 內(nèi)容的 width，height = border + padding + 內(nèi)容的 height。
es6新特性
ES6常用語法整合
Babel是一個廣泛使用的轉(zhuǎn)碼器，可以將ES6代碼轉(zhuǎn)為ES5代碼，從而在現(xiàn)有環(huán)境執(zhí)行。這意味著，你可以現(xiàn)在就用ES6編寫程序，而不用擔(dān)心現(xiàn)有環(huán)境是否支持。
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))
解構(gòu)賦值
數(shù)組中的值會自動被解析到對應(yīng)接收該值的變量中
var [name,,age] = ['a', 'b', 3]
console.log(name + age);
默認參數(shù)
定義函數(shù)的時候指定參數(shù)的默認值
// es5
function fn(name) {
var name = name || 'a'
console.log(name);
}
fn()//a
// es6
function fn(name='b') {
console.log(name);
}
fn()//b
多行字符串
使用反引號`來創(chuàng)建字符串
//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 關(guān)鍵字！可以把let看成var，它定義的變量被限定在了特定范圍內(nèi)。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循環(huán)用于遍歷數(shù)組，類數(shù)組或?qū)ο?，ES6中新引入的for of循環(huán)功能相似，不同的是每次循環(huán)它提供的不是序號而是值。
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
構(gòu)造函數(shù)繼承
Cat.prototype = new Animal();
Cat.prototype.constructor = Cat;
非構(gòu)造函數(shù)繼承
function object(o) {
function F() {}
F.prototype = o;
return new F();
}
JavaScript 繼承簡單理解與實現(xiàn)
JavaScript 原型理解與創(chuàng)建對象應(yīng)用
事件捕獲事件冒泡事件代理
JavaScript 詳說事件機制之冒泡、捕獲、傳播、委托
javascript 有沒有更高效的事件綁定寫法？
clone: Object.create(obj)
http://www.cnblogs.com/yugege/p/6526215.html
