注：以下部分代碼或術語涉及ECMAScript 6。

1. literal

literal（字面量）即開發者寫的，可直接被解析器識別，不必顯式依賴API創建的量。如：

• 數字literal：123, 0b1111011, 0o173, 0x7B
• 字符串literal："123", `12{2+1}`
• 數組literal：[1,2,8]
• 對象literal：{A:1,B:2,C:8}
• 正則表達式literal：/^\d+(?:\.\d+)?$/
• 其他literal：true, false, null

2. IIFE

還記得為了閉包（closure）而編寫的聲明即執行的函數表達式嗎？這種函數表達式是IIFE，讀作[iffy]。

var chars=//charCode為0x20,0x21,...,0x7F的一組字符組成的字符串，由以下IIFE表示 (function(){var a=[];for(let i=0x20;i<0x80;i++){a.push(i);}return String.fromCharCode.apply(String,a); })();

3. property and expando

property對于一般JavaScript開發者來說，熟悉而又陌生：
一個object的property含property key和property descriptor兩部分。
property key分string和symbol兩種。
property descriptor分data descriptor和accessor descriptor兩種。
data descriptor有固定的value，而accessor descriptor有getter與/或setter。
property descriptor中的enumerable，configurable分別表示property是否可枚舉，是否可重定義。

expando是property的一個形容詞，指在規范之外擴展的，僅供實現者內部使用的。
對于jQuery而言，jQuery.fn屬性可算作一個expando property。

舉例：

var lengthExpando=Symbol.for("length"); function ArrayLike(){var length=0;// ...Object.defineProperty(this,lengthExpando,// symbol as a property key{enumerable:false,configurable:true,value:length}// data descriptor);// define an expando propertyObject.defineProperty(this,"length",// string as a property key{enumerable:false,configurable:true,get:function(){return this[lengthExpando];},set:function(value){var num=+value;var len=num>>>0;if(len!=num){throw new RangeError("Invalid length");}// ...this[lengthExpando]=len;}}// accessor descriptor);// define a spec-defined property }

4. mixin

與plugin可被安裝到兼容的宿主程序的概念類似，mixin是一個class/object，它的屬性/方法可動態復制到其他適配的class/object。
舉例：

// define a mixin which is compatible with any Array-like class or object var ArrayLikePrototype={get firstElement(){var index=0;if(index<this.length){return this[index];}//return undefined;},getFirstElement(){var index=0;if(index<this.length){return this[index];}//return undefined;},get lastElement(){var index=this.length-1;if(index>-1){return this[index];}//return undefined;},getLastElement(){var index=this.length-1;if(index>-1){return this[index];}//return undefined;},// ... };// mix `ArrayLikePrototype` in `NodeList.prototype` Object.defineProperties(NodeList.prototype,Object.getOwnPropertyDescriptors(ArrayLikePrototype));// mix `ArrayLikePrototype` in `HTMLCollection.prototype` Object.defineProperties(HTMLCollection.prototype,Object.getOwnPropertyDescriptors(ArrayLikePrototype)); //so that `document.children.firstElement` will be document.children[0]// or even mix `ArrayLikePrototype` in `Array.prototype` Object.defineProperties(Array.prototype,Object.getOwnPropertyDescriptors(ArrayLikePrototype)); //so that `[1,2,3].lastElement` will be 3, and `[1,2,3].getLastElement()` will be 3 too

5. shim and polyfill

shim 是為修正運行環境API而編寫的代碼。如：

// shim Window#setTimeout() if(document.documentMode==9&&!Object.prototype.hasOwnProperty.call(window,"setTimeout")){var WindowSetTimeout=Window.prototype.setTimeout;Window.prototype.setTimeout=function setTimeout(callback, delay){if(arguments.length<3||typeof callback!="function")return WindowSetTimeout.call(this, callback, delay);var args=Array.prototype.slice.call(arguments, 2);return WindowSetTimeout.call(this, function(){callback.apply(this, args);}, delay);}; }//shim window.Event if(document.documentMode>8&&typeof window.Event=="object"){var nativeEvent=window.Event;var shimedEvent=function Event(type/*,eventInit*/){if(!(this instanceof Event))throw new TypeError("Failed to construct 'Event': Please use the 'new' operator, this DOM object constructor cannot be called as a function.");if(arguments.length===0)throw new TypeError("Failed to construct 'Event': An event type must be provided.");var event=document.createEvent("Event"),eventInit={bubbles:false,cancelable:false},p=Object.assign(eventInit,arguments[1]);event.initEvent(type,p.bubbles,p.cancelable);return event;};shimedEvent.prototype=nativeEvent.prototype;window.Event=shimedEvent; }

polyfill是為填補運行環境缺失的功能而提供的變通實現代碼。如：

// polyfill Object.assign() if(typeof Object.assign!="function"){Object.assign=function assign(object,source){var to,from,sources,nextSource,i,j,len,keys,key;//#1if(object==null)throw new TypeError("Cannot convert "+object+" to Object");to=Object(object);//#3if(arguments.length===1)return to;//#4sources=Array.prototype.slice.call(arguments,1);//#5for(i=0; i<sources.length; i++){//#anextSource=sources[i];if(nextSource==null){continue;}//#bfrom=Object(nextSource);//#dkeys=Object.keys(from);//#elen=keys.length;//#ffor(j=0;j<len;j++){key=keys[j];to[key]=from[key];}}//#6return to;}; } // polyfill HTMLElement#hidden if(typeof document.documentElement.hidden!="boolean"){Object.defineProperty(HTMLElement.prototype,"hidden",{get:function getHidden(){return this.getAttribute("hidden")!=null;},set:function setHidden(v){if(v)this.setAttribute("hidden", "");elsethis.removeAttribute("hidden");}}); }

6. SemVer

越扯越遠，這一條似乎與JavaScript不相關。

平時我們看到的一些軟件庫文件名如jquery-2.1.3.js，知道其中的版本號2.1.3遵循X.Y.Z，但XYZ每部分的含義，升級規則和比較/排序規則卻又不清楚。
為了定義一個通用的版本號標準，GitHub聯合創始人Tom Preston-Werner編寫了SemVer(Semantic Versioning)規范。
SemVer 2.0.0規范定義的版本號的格式如下：
major . minor . patch [ - pre] [ + build]
一個SemVer版本號不僅僅代表著一個獨特的版本，還牽涉到其背后一系列的排序/升級/關聯/篩選規則。

7. vanilla

這里的vanilla指尋常的，無特色的。vanilla js用中文說即純手工編寫，未用到第三方框架的js。

VanillaJS是一個沒有可運行代碼的JavaScript框架，通常被用作愚人節玩笑。它列舉一些直接調用原生API而不必借助框架的實踐方式，并突出這些尋常代碼相對基于框架調用的代碼所帶來的性能優勢，其思想有種道家無為的意味。但恰恰其他框架在試圖證明使用框架后相對VanillaJS所帶來的兼容/易用優勢。

to be continued

更多見 MDN詞匯表

總結

以上是生活随笔為你收集整理的一般人不清楚的JavaScript概念的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。