整理JavaScript高級基礎知識

因為空余時間很多..所以博客更新頻率得相對頻繁些..

原型以及原型鏈

考察原型以及原型鏈：

var object = {}
object.__proto__ ===  Object.prototype  // 為 true

var fn = function(){}
fn.__proto__ === Function.prototype  // 為 true
fn.__proto__.__proto__ === Object.prototype // 為 true

var array = []
array.__proto__ === Array.prototype // 為 true
array.__proto__.__proto__ === Object.prototype  // 為 true

Function.__proto__ === Function.prototype // 為 true
Array.__proto__ === Function.prototype // 為 true
Object.__proto__ === Function.prototype // 為 true

true.__proto__ === Boolean.prototype // 為 true

Function.prototype.__proto__ === Object.prototype // 為 true
 

this

考察 this：

function fn(){
    console.log(this)
}
new fn()

new fn() 會執行 fn，並打印出 this，請問這個 this 有哪些屬性？這個 this 的原型有哪些屬性？

this 自身沒有屬性（只有一個隱藏的 proto 屬性）
this 的原型是 fn.prototype，只有一個屬性 constructor，且 constructor === fn（另外還有一個隱藏屬性 proto，指向 Object.prototype）

JSON

考察JSON

JSON 和 JavaScript 是什麽關系？
JSON 和 JavaScript 的區別有哪些？

他們的關系：

JSON 是在某一些方面借鑒了JavaScript的一種輕量級的數據交換格式，是一門新語言。

除了 JavaScript 基本數據類型中的 undefined 、symbol，復雜類型中的 function，其他的數據類型在 JSON 中都有。

他們的區別有：

JSON 中的字符串必須用雙引號括起，JavaScript 中字符串單雙引號都可以；

JSON 中沒有變量，所以不能引用，JavaScript中有變量，可以引用；

JSON 中沒有原型鏈，JavaScript有原型鏈；

MVC

前端 MVC 是什麽？

請用代碼大概說明 MVC 三個對象分別有哪些重要屬性和方法。

前端MVC是什麽

MVC 是一種代碼組織形式，他把代碼依據功能的不同劃分成三個部分，分別是Model、Controller、View。

View代表視圖

Model代表對數據的操作(存儲和獲取等)

Controller代表了View和Model兩者之間的交互邏輯以及其他。

他們之間的相互作用是這樣的：

用戶對View視圖做出了操作，監聽著View視圖的controller接收到了View的變化通知，然後按需求去調用Model，Model向server發出請求；server返回響應給Model，Model返回數據給Controller，Controller根據接收到的數據更新View視圖。

代碼示例

View 主要接受一個選擇器，獲取需要監聽的區域，然後返回一個對象給 controller 操作、更新：

window.View = function(selector){
    return this.document.querySelector(selector)
}

Model 主要負責數據庫的初始化、數據的存儲和獲取，所以他的重要屬性應該要要有 init 、fetch 、save:

window.Model = function(options){
    //通過傳入參數獲取需要操作數據庫
    var resourceName = options.resourceName
    return {
        //初始化數據庫
        init:function(){},

        //獲取數據：
        fetch:function(){},

        //保存數據
        save:function(){}
        }
}

Controller 負責監聽和更新 view，調用 model ，接受操作 model 返回的數據，所以他要有一個 init 接收傳入的 view 和 model ，負責 model 的調用 和 執行綁定事件函數 bindEvents()：

window.Controller = function(options){

    var init = options.init

    var object = {
        view:null,
        model:null,
        init:function(view,model){
            this.view = view
            this.model = model
            this.model.init()
            init.call(this,view,model)
            this.bindEvents.call(this)
        },
    }

    //通過遍歷傳入的參數  加入函數到object 中，處理其它事務
    for(let key in options){
        if(key !== "init"){
            object[key]=options[key]
        }
    }
    return object
}

在 ES5 中如何用函數模擬一個類？

考察面向對象編程：

function Human(id,hp){
    this.id = id
    this.hp = hp
}
Human.prototype = {
    constructor:Human,
    walk:function(){ /**/ } ,
    species:function(){ /**/ } ,
    useTools:function(){ /**/ } ,
}

Promise

考察 Promise 的用法：

用過 Promise 嗎？舉例說明。

有，在使用 leanCloud 數據庫的時候，我通過調用一個 leanCloud 的 API ：fetch 函數獲取數據庫的數據，這個函數被調用後，返回一個 Promise 對象；這個 Promise 對象有一個 then 屬性，他接受兩個回調函數作為參數，一旦數據獲取成功(resolve)，則把數據傳入 then 後的第一個函數，對數據進行相對操作；如果數據獲取失敗(reject)，則執行第二個函數。

如果要你創建一個返回 Promise 對象的函數，你會怎麽寫？舉例說明。

function promise(){
    return new Promise((resolve,reject) => {
        console.log(‘this\‘s Promise begin‘)
        resolve(10)
    })
}
promise().then((value)=>{
    console.log(value)
    console.log(‘that\‘s Promise end‘)
})

整理JavaScript高級基礎知識