十五的學習日記20160927-ES6學習/中間變量/數組坑/

#十五的學習日記20160927

JavaScript

1. ES6新特性之對象簡寫(屬性簡寫,特性方法簡寫,可計算屬性值),注:多個同名屬性會被後者覆蓋

// Shorthand property names (ES6)
var a = "foo", b = 42, c = {};
var o = { a, b, c };

// Shorthand method names (ES6)
var o = {
  property([parameters]) {},
  get property() {},
  set property(value) {},
  * generator() {}
};

// Computed property names (ES6)
var prop = "foo";
var o = {
  [prop]: "hey",
  ["b" + "ar"]: "there",
};

1. [[property]]的用法,[[property]]又稱做特性,或者屬性描述用於給屬性添加額外的能力.在一些語境中, attribute是對外的屬性,而property則是對內的屬性,這有點像特色和天賦的區別,特色是展現給別人看的,而天賦倒是特色的根本.
   ES6中,setter的用法 :set + 屬性名+參數+函數體
   舉例說明:

var o = {
  set current (str) {//給current屬性設置了一個setter方法,和普通方法不一樣的是, 直接訪問setter不會返回函數體.
    this.log[this.log.length] = str;
  },
  log: []
}
o.current="1234"    //"1234"
o.log               //["1234"]
o.current           //undefined

下面來看ES5的寫法:必須使用Object.defineProperty或Object.defineProperties來定義[[property]],

var o={};Object.defineProperty(o,"b",{get:function(){return this}});
o.b;//返回b{};

1. 一道題,考察js的引用數據類型

function foo(x) {x.push( 4 );x = [4,5,6];x.push( 7 ); return window.a}
var a = [1,2,3];
foo( a );//[1,2,3,4]
//結果是顯然的,那麼怎樣修改a自己?
function foo(x) {x.push( 4 );x.length = 0; x.push( 4, 5, 6, 7 ); return window.a}
var a = [1,2,3];
foo( a );//[4,5,6,7]
//對引用類型進行值傳遞,須要一份深拷貝
foo(a.slice());

1. 中間變量的意義:
   好比字符串.length的運做過程是將字符串包裝成包裝類,而後獲取length屬性,因此在for循環中每次都要執行這樣的操做一次,這很吃性能,最好是把他儲存爲中間變量.
2. 包裝類的解除包裝能夠經過訪問valueOf屬性得到基本值.
3. 數組的一些坑:

var a=new Array(3);//[undefined × 3]
var b=[,,,]//三個逗號竟然返回[undefined × 3]
var c=[undefined,undefined,undefined]
var d=[];d.length=3;//[undefined × 3]
b.map((i,x)=>{return x;})//[undefined × 3],由於下標不真實存在!
c.map((i,x)=>{return x;})//[0,1,2]!! 由於下標真實存在!
//若是你想建立空數組,最好的辦法是
Array.apply(null,{length:3})//返回[undefined,undefined,undefined]

7.日期類型兩種得到當前日期的方法

Date.now() equal (new Date()).getTime()

1. symbol用法:Symbol.for()與Symbol()這兩種寫法，都會生成新的Symbol。它們的區別是，前者會被登記在全局環境中供搜索，後者不會。Symbol.for()不會每次調用就返回一個新的Symbol類型的值，而是會先檢查給定的key是否已經存在，若是不存在纔會新建一個值。好比，若是你調用Symbol.for("cat")30次，每次都會返回同一個Symbol值，可是調用Symbol("cat")30次，會返回30個不一樣的Symbol值。

var a=Symbol("a")//返回一個惟一的標記
var b=Symbol.for("b")//返回一個登記在Symbol全局表中的標記,
Symbol.keyFor(b)//複查其字符值.
做爲屬性名的Symbol
因爲每個Symbol值都是不相等的，這意味着Symbol值能夠做爲標識符，用於對象的屬性名，就能保證不會出現同名的屬性。這對於一個對象由多個模塊構成的狀況很是有用，能防止某一個鍵被不當心改寫或覆蓋。
var mySymbol = Symbol();
var a = {};a[mySymbol] = 'Hello!';// 第一種寫法
var a = {[mySymbol]: 'Hello!'};// 第二種寫法
var a = {};Object.defineProperty(a, mySymbol, { value: 'Hello!' });// 第三種寫法
a[mySymbol] // "Hello!"// 以上寫法都獲得一樣結果
內置的Symbol值
除了定義本身使用的Symbol值之外，ES6還提供了11個內置的Symbol值，指向語言內部使用的方法。
Symbol.hasInstance
對象的Symbol.hasInstance屬性，指向一個內部方法。當其餘對象使用instanceof運算符，判斷是否爲該對象的實例時，會調用這個方法。好比，foo instanceof Foo在語言內部，實際調用的是Foo[Symbol.hasInstance](foo)。
class MyClass {  [Symbol.hasInstance](foo) {return foo instanceof Array;}}
[1, 2, 3] instanceof new MyClass() // true
上面代碼中，MyClass是一個類，new MyClass()會返回一個實例。該實例的Symbol.hasInstance方法，會在進行instanceof運算時自動調用，判斷左側的運算子是否爲Array的實例。
下面是另外一個例子。
class Even {static [Symbol.hasInstance](obj) {return Number(obj) % 2 === 0;}}
1 instanceof Even // false
2 instanceof Even // true
12345 instanceof Even // false

1. JSON.stringify
   該方法沒法識別undefined\Symbol\function,會跳過他們,若是沒法跳過就會轉化成null.
   特別的若是存在循環引用的數據,會直接報錯.
   額外的若是要打包的對象中有toJSON()方法,那麼會調用這個方法得到的值做爲打包的值.

var a = {
val: [1,2,3],
// probably correct!
toJSON: function(){
return this.val.slice( 1 );
}
};
var b = {
val: [1,2,3],
// probably incorrect!
toJSON: function(){
return "[" +
this.val.slice( 1 ).join() +
"]";
}
};
JSON.stringify( a ); // "[2,3]"
JSON.stringify( b ); // ""[2,3]""

1. 剩下的明天再寫,晚安