重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,天天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的能夠加入winter的專欄學習【原文有winter的語音】,若有侵權請聯繫我,郵箱:kaimo313@foxmail.com。前端
若是有點猶豫,不妨看看下面的介紹,或者找找資料溫習一下。java
Undefined:git
Null:es6
Note: 現行的字符集國際標準,字符是以 Unicode 的方式表示的,每個 Unicode 的碼點表示一個字符,理論上,Unicode 的範圍是無限的。UTF 是 Unicode 的編碼方式,規定了碼點在計算機中的表示方法,常見的有 UTF16 和 UTF8。Unicode 的碼點一般用 U+??? 來表示,其中 ??? 是十六進制的碼點值。0-65536(U+0000 - U+FFFF)的碼點被稱爲基本字符區域(BMP)。github
==
(=== 也不行)來比較關於javaScript中 0.1 + 0.2 == 0.3 ?
這個問題的解釋:編程
console.log( 0.1 + 0.2 == 0.3);
>> false
複製代碼
輸出結果爲false
,說明兩邊不相等,這是浮點運算特色致使的,實際上,這裏錯誤的不是結論,而是比較的方法,正確的比較方法是使用javaScript提供的最小精度值:函數
咱們能夠查找MDN文檔的Number能夠找到屬性EPSILON
學習
Number.EPSILON
:兩個可表示數字之間的最小間隔測試
console.log( Math.abs(0.1 + 0.2 - 0.3) <= Number.EPSILON);
>> true
複製代碼
這樣的比較輸出結果爲true
,檢查等式左右兩邊差的絕對值是否小於最小精度,纔是正確的比較浮點數的方法
。ui
關於Symbol的介紹,我準備用ES6文檔-阮一峯來作一些介紹,具體的能夠參考文檔
ES5 的對象屬性名都是字符串,這容易形成屬性名的衝突。ES6引入了一種新的原始數據類型Symbol,表示獨一無二的值。從根本上防止屬性名的衝突。
凡是屬性名屬於 Symbol 類型,就都是獨一無二的,能夠保證不會與其餘屬性名產生衝突。
4.2.一、Symbol 值經過Symbol函數生成,先來一段代碼:
let s = Symbol();
typeof s
>> "symbol"
複製代碼
上面代碼中,變量s
就是一個獨一無二的值。s
是Symbol
數據類型。
4.2.二、Symbol函數能夠接受一個字符串做爲參數,表示對 Symbol 實例的描述
let s1 = Symbol('foo');
let s2 = Symbol('bar');
s1
>> Symbol(foo)
s2
>> Symbol(bar)
s1.toString()
>> "Symbol(foo)"
s2.toString()
>> "Symbol(bar)"
複製代碼
上面代碼中,s1
和s2
是兩個 Symbol
值。若是不加參數,它們在控制檯的輸出都是Symbol()
,不利於區分。有了參數之後,就等於爲它們加上了描述,輸出的時候就可以分清,究竟是哪個值。
4.2.三、若是 Symbol
的參數是一個對象,就會調用該對象的toString
方法,將其轉爲字符串,而後才生成一個 Symbol
值。
const obj = {
a: '123123',
toString() {
return 'iuoisigud';
}
};
const sym = Symbol(obj);
sym // Symbol(iuoisigud)
複製代碼
4.2.四、Symbol
函數的參數只是表示對當前 Symbol
值的描述,所以相同參數的Symbol
函數的返回值是不相等的。
// 沒有參數的狀況
let s1 = Symbol();
let s2 = Symbol();
s1 === s2 // false
// 有參數的狀況
let s1 = Symbol('foo');
let s2 = Symbol('foo');
s1 === s2 // false
複製代碼
4.2.五、Symbol
值不能與其餘類型的值進行運算,會報錯。
let sym = Symbol('My symbol');
"your symbol is " + sym
// TypeError: can't convert symbol to string
`your symbol is ${sym}`
// TypeError: can't convert symbol to string
複製代碼
4.2.六、Symbol
值能夠顯式轉爲字符串,也能夠轉爲布爾值,可是不能轉爲數值。
let sym = Symbol('My symbol');
String(sym) // 'Symbol(My symbol)'
sym.toString() // 'Symbol(My symbol)'
let sym = Symbol();
Boolean(sym) // true
!sym // false
Number(sym) // TypeError
sym + 2 // TypeError
複製代碼
4.2.七、其餘的一些屬性能夠去看ES6文檔-阮一峯
Symbol
函數前不能使用new
命令,不然會報錯。這是由於生成的Symbol
是一個原始類型的值,不是對象。也就是說,因爲Symbol
值不是對象,因此不能添加屬性。基本上,它是一種相似於字符串的數據類型
。
Object 是 JavaScript 中最複雜的類型,也是 JavaScript 的核心機制之一。
回答:「運算符提供了裝箱操做,它會根據基礎類型構造一個臨時對象,使得咱們能在基礎類型上調用對應對象的方法。」
好比原型上添加方法,也能夠應用於基本類型:
Symbol.prototype.hello = () => console.log("hello");
var a = Symbol("a");
console.log(typeof a); //symbol,a 並不是對象
a.hello(); //hello,有效
複製代碼
字符串到數字的類型轉換,存在一個語法結構,類型轉換支持十進制、二進制、八進制和十六進制
好比:
Number('0xFF')
>> 255
複製代碼
裝箱(boxing):值類型實例到對象的轉換,它暗示在運行時實例將攜帶完整的類型信息,並在堆中分配。
每一種基本類型 Number
、String
、Boolean
、Symbol
在對象中都有對應的類,所謂裝箱轉換,正是把基本類型轉換爲對應的對象,它是類型轉換中一種至關重要的種類。
例子:利用一個函數的
call
方法來強迫產生Symbol
裝箱
var symbolObject = (function() {
return this;
}).call(Symbol("a"));
console.log(typeof symbolObject); //object
console.log(symbolObject instanceof Symbol); //true
console.log(symbolObject.constructor == Symbol); //true
複製代碼
例子:使用內置的 Object 函數,咱們能夠在 JavaScript 代碼中顯式調用裝箱能力。
var symbolObject = Object(Symbol("a"));
console.log(typeof symbolObject); //object
console.log(symbolObject instanceof Symbol); //true
console.log(symbolObject.constructor == Symbol); //true
複製代碼
每一類裝箱對象皆有私有的
Class
屬性,這些屬性能夠用Object.prototype.toString
獲取:
var symbolObject = Object(Symbol("a"));
console.log(Object.prototype.toString.call(symbolObject));
>> [object Symbol]
複製代碼
拆箱(unboxing):是將引用類型轉換爲值類型
6.5.一、在 JavaScript 標準中,規定了 ToPrimitive 函數,它是對象類型到基本類型的轉換
toPrimitive(input, preferedType)
複製代碼
input是輸入的值,preferedType是指望轉換的類型,它能夠是字符串,也能夠是數字。
inputType | Result |
---|---|
Undefined | input argument |
Null | input argument |
Boolean | input argument |
Number | input argument |
String | input argument |
Object | 忽略 第二個參數 hint PreferredType 直接調用內置方法 [[DefaultValue]] |
6.5.二、若是轉換的類型是number,會執行如下步驟:參考博客
input.valueOf()
,若是結果是原始值,返回結果;input.toString()
。若是結果是原始值,返回結果;6.5.三、若是轉換的類型是String,2和3會交換執行,即先執行toString()
方法。
例子1:先將兩個操做數轉換爲string,而後進行拼接
[] + []
>> ""
[] -----> ''
[] -----> ''
[] + [] = ''
複製代碼
例子2:先將兩個操做數轉換爲string,而後進行拼接
[] + {}
>> "[object Object]"
// 解釋
[] -----> ''
{} -----> '[object Object]'
[] + {} = '[object Object]'
複製代碼
例子3:js解釋器會將開頭的 {} 看做一個代碼塊,而不是一個js對象
{} + []
>> 0
// 真正參與運算的是 + []
// {} + [] 等價於 + []
複製代碼
在整理知識點的時候,我就發現,我多是真的划水醬_(:3」∠)_
,裏面大部分的東西很模糊,有點都不清不楚的,還有的沒有聽過,看來要好好打打基礎了,如今前端的發展過於太快了,而本身的基礎又不牢固,能跟着winter學習是個人幸運,不過在這裏要感謝一個大佬的推薦,stormzhang
,公衆號也是這個,個人學習榜樣來的,哈哈哈哈哈。