釋一下為何[ ]==![ ] // ---> true

首先看一張圖

！[ ] 是 false
原式：[ ]==false
根據(jù)第八條，false通過tonumber（）轉(zhuǎn)換為0
原式：[ ]==0
根據(jù)第十條，[ ]通過ToPrimitive()轉(zhuǎn)換為' '
原式：' '==0
根據(jù)第六條
原式：0==0

嘗試實(shí)現(xiàn)new

        function ObjectClass() {//對(duì)象
            console.log(arguments[0])
        }
        ObjectClass.prototype.constructor=ObjectClass
 
        function create() {
            // 創(chuàng)建一個(gè)空的對(duì)象
            var obj={}
            // 獲得構(gòu)造函數(shù)
            var _constructor=this
            // 鏈接到原型
            obj.__proto__=_constructor.prototype
            // 綁定 this，執(zhí)行構(gòu)造函數(shù)
            var result=_constructor.apply(obj, arguments)
            // 確保 new 出來(lái)的是個(gè)對(duì)象
            return typeof result==='object' ? result : obj
        }
        create.call(ObjectClass, 'hello world')//實(shí)例化

拓展typeof功能使其支持更多類型（array，object，null區(qū)分），并解釋一下typeof null為何是object

        function myTypeOf(target) {
            var _type=typeof (target)
            var temp={
                "[object Object]": 'object',
                "[object Array]": 'array',
                "[object Number]": 'number',
                "[object String]": 'string',
                "[object Boolean]": 'boolean'
            }
            if (target===null) {
                return 'null'
            } else if (_type=='object') {
                var str=Object.prototype.toString.call(target)//根據(jù)toString區(qū)分
                return temp[str]
            } else {
                return _type
            }
        }
        console.log(myTypeOf('hello')) //string
        console.log(myTypeOf(111)) // number
        console.log(myTypeOf(true)) // boolean
        console.log(myTypeOf({})) // object
        console.log(myTypeOf([])) // array
        console.log(myTypeOf(null)) // null
        console.log(myTypeOf(undefined)) // undefined
        console.log(myTypeOf(Symbol())) // symbol

typeof null為何是object

因?yàn)樵谠缙趈s初版本中，操作系統(tǒng)使用的是32位，出于性能考慮，使用低位存儲(chǔ)變量類型，object的類型前三位是000，而null是全0，從而系統(tǒng)將null誤判為object

instanceof是什么？嘗試實(shí)現(xiàn)一下

用官話來(lái)講：instanceof用于檢測(cè)構(gòu)造函數(shù)的prototype屬性是否出現(xiàn)在某個(gè)實(shí)例對(duì)象的原型鏈上

通俗來(lái)講，a instanceof b也就是判斷a是否是由b實(shí)例化得來(lái)的

實(shí)現(xiàn)：

        function ObjectClass() {}
        ObjectClass.prototype.constructor=ObjectClass
        var _objectClass=new ObjectClass()
 
        function myInstanceof(orgProto, tag) { //org前者，實(shí)例化對(duì)象, tag后者，類
            var tagProto=tag.prototype
            orgProto=orgProto.__proto__
            for (;;) { //死循環(huán)查詢?cè)玩溕鲜欠裼蓄惖脑?
                if (orgProto===null) {
                    return false
                }
                if (orgProto===tagProto) {
                    return true
                }
                orgProto=orgProto.__proto__
            }
        }
        console.log(myInstanceof(Object, Function)) // true
        console.log(myInstanceof(Object, Object)) // true
        console.log(myInstanceof(String, Object)) // true
        console.log(myInstanceof(_objectClass, Object)) // true
        console.log(myInstanceof(String, String)) // false
        console.log(myInstanceof(Boolean, Boolean)) // false

解釋以下代碼分別在控制臺(tái)顯示什么，并簡(jiǎn)單說明

有一個(gè)對(duì)象Car，分別對(duì)以下四種情況進(jìn)行作答

Car.prototype.name='BMW'
 
function Car() {}

1.實(shí)例化對(duì)象時(shí)打印BMW，因?yàn)镃ar.prototype.name='BMW'，實(shí)例化的car本身沒有name屬性，于是會(huì)在Car的原型上找。此時(shí)將Car.prototype.name='Benz'，實(shí)例化后的car.name也會(huì)等于Benz，因?yàn)閚ame是基本數(shù)據(jù)類型（原始值），當(dāng)值發(fā)送變化，實(shí)例化后的對(duì)象也會(huì)改變

        var car=new Car()
        console.log(car.name) //BMW
        Car.prototype.name='Benz'
        console.log(car.name) //Benz

2.實(shí)例化對(duì)象時(shí)打印Benz，因?yàn)樵趯?shí)例化之前就已經(jīng)改變構(gòu)造函數(shù)原型上的name值

              Car.prototype.name='Benz'
        var car=new Car()
        console.log(car.name) //Benz

3.第一個(gè)log的BMW與上述一樣，第二個(gè)log依然打印BMW的原因是，這里將Car.prototype直接改變成另一個(gè)對(duì)象，由于對(duì)象是引用數(shù)據(jù)類型（引用值），指向的是內(nèi)存地址而不是值，new之前和new之后的實(shí)例對(duì)象引用的name地址不同

        var car=new Car()
        console.log(car.name) //BMW
        Car.prototype={
            name: 'Benz'
        }
        console.log(car.name) //BMW

4.和上述相同，原因是修改了prototype，改變的是引用地址，new之前和new之后的實(shí)例對(duì)象引用的name地址不同

        Car.prototype={
            name: 'Benz'
        }
        var car=new Car()
        console.log(car.name) //Benz

寫一個(gè)函數(shù)，計(jì)算字符串Unicode總長(zhǎng)度（例如：abcd，打印4，qwerdf，打印6）

需要注意的是，英文字符占1個(gè)字節(jié)，中文字符占兩個(gè)字節(jié)

        function unicodeLength(str) {
            for (var i=0, count=0; i < str.length; i++) {
                console.log(str.charCodeAt(i))
                if (str.charCodeAt(i) > 255) { //中文字符
                    count +=2
                } else { //英文字符
                    count++
                }
            }
            return count
        }
        console.log(unicodeLength('hello，1024，你好')) //17

實(shí)現(xiàn)一下js中window自帶的isNaN()函數(shù)

注意點(diǎn)：如果直接使用NaN==NaN來(lái)判斷，會(huì)返回false，需要將NaN轉(zhuǎn)換成字符串，再來(lái)判斷

        isNaN('asda') //window下的原函數(shù)
        console.log(isNaN(13)) //false
        console.log(isNaN('aaa')) //true
 
        function myIsNaN(number) {
            return "" + Number(number)=="NaN" ? true : false
        }
        console.log(myIsNaN(32323)) //false
        console.log(myIsNaN('aaa')) //true

實(shí)現(xiàn)數(shù)組push()方法

        function myPush() {
            for (var i=0; i < arguments.length; i++) {
                this[this.length]=arguments[i]
            }
            return this.length
        }
        Array.prototype.myPush=myPush
        var list=[1, 2, 3, 4, 5]
        var item=6
        console.log(list.myPush(item)) //6
        console.log(list) //[1, 2, 3, 4, 5, 6]

實(shí)現(xiàn)數(shù)組亂序（提示：使用Array.sort）

Array.sort((a,b)=>{})中a-b升序，b-a降序

        Array.prototype.random=random
 
        function random() {
            this.sort(function () {
                return Math.random() - 0.5
            })
            return this
        }
        var list=[1, 2, 3, 4, 5, 6, 7, 8, 9]
        console.log(list.random())//[3, 2, 6, 4, 9, 8, 1, 5, 7] 結(jié)果每次都不同

以下代碼在控制臺(tái)顯示什么？說明原因

        var obj={
            "0": 'a',
            "1": 'b',
            "2": 'c',
            "length": 3,
            "push": Array.prototype.push
        }
        obj.push(1, 2, 3)
        console.log(obj)

打印結(jié)果是

        {
            0: "a"
            1: "b"
            2: "c"
            3: 1
            4: 2
            5: 3
            length: 6
        }

原因：說明原因之前先看一段Array.prototype.push的源碼：

function ArrayPush () {  
var n=TO_UNIT32(this.length);  
var m=%_ArgumentsLength();  
for (var i=0; i < m; i++) {
    this[i + n ]=%_Arguments(i);
  }  this.length=n + m;
  return this.length;
}

push的原理是在原對(duì)象后面將push的內(nèi)容遍歷進(jìn)去，獲取this.length并且在此基礎(chǔ)上加上push的個(gè)數(shù)，這就不難解釋為何push了三個(gè)數(shù)后length為6

解釋以下代碼打印為undefined的原因

        var num=123;
        num.item='abc'
        console.log(num.item) //undefined

第一步：var num=123

第二步：num.item='abc'//隱式轉(zhuǎn)換，相當(dāng)于new Number(num).item='abc'（包裝類生成引用類型數(shù)據(jù)），此時(shí)底層會(huì)判定此時(shí)的num是原始值，不存在屬性值，所以執(zhí)行delete（num.item）

第三步：打印undefined

使用JS原生實(shí)現(xiàn)function中的call，apply，bind函數(shù)

call:

        Function.prototype.myCall=function () {
            var _this=arguments[0] || window; //第一項(xiàng)是需要this指向的對(duì)象
            _this._function=this //this是要執(zhí)行的函數(shù)，改變指向?yàn)開this
            var args=[] //把除this之外的所有參數(shù)放在args中
            for (var i=1; i < arguments.length; i++) { //i=1，第二項(xiàng)到最后一項(xiàng)是參數(shù)
                args[i - 1]=arguments[i]
            }
            return eval("_this._function(" + args + ")") //eval能將數(shù)組隱式拆分，效果與join相似，但二者區(qū)別很大，return將函數(shù)執(zhí)行結(jié)果返回
            delete _this._function //執(zhí)行完成后刪除當(dāng)前_function,這個(gè)_function用來(lái)放this
        }
        var a='window'
        var obj1={
            a: 'obj1',
            fn: function () {
                console.log(this.a)
                console.log(arguments)
            }
        }
        var obj2={
            a: 'obj2'
        }
        obj1.fn.myCall(obj2, 1, 2, 3, 4) //obj2  arguments[1, 2, 3, 4]
        obj1.fn.myCall(this, 3, 2, 1) //window  arguments[3, 2, 1]

apply（調(diào)用上面的myCall實(shí)現(xiàn)即可）:

        Function.prototype.myApply=function () {
            var _this=arguments[0] || window; //第一項(xiàng)是需要this指向的對(duì)象
            _this._function=this //this是要執(zhí)行的函數(shù)，改變指向?yàn)開this
            return eval("_this._function.myCall(_this, " + arguments[1] + ")") //eval能將數(shù)組隱式拆分，效果與join相似，但二者區(qū)別很大，return將函數(shù)執(zhí)行結(jié)果返回
            delete _this._function //執(zhí)行完成后刪除當(dāng)前_function,這個(gè)_function用來(lái)放this
        }
        var a='window'
        var obj1={
            a: 'obj1',
            fn: function () {
                console.log(this.a)
                console.log(arguments)
            }
        }
        var obj2={
            a: 'obj2'
        }
        obj1.fn.myApply(obj2, [1, 2, 3, 4]) //obj2  arguments[1, 2, 3, 4]
        obj1.fn.myApply(this, [3, 2, 1]) //window  arguments[3, 2, 1]

bind（繼續(xù)調(diào)用上面myApply）:

        Function.prototype.myBind=function () {
            var t=this;
            var _this=arguments[0] || window; //第一項(xiàng)是需要this指向的對(duì)象
            var args=Array.prototype.slice.myApply(arguments, [
                1], ) //這項(xiàng)的目的是為了去除第一項(xiàng)arguments[0]，就與上面的myCall中的遍歷作用相同，Array.prototype.slice傳一個(gè)參數(shù)，slice(start,end)表示刪除第start到end項(xiàng)并返回刪除后的數(shù)組，這里我們只用截取，不用刪除，這里是刪除第一項(xiàng)（由于用的是myApply，第二個(gè)參數(shù)是數(shù)組所以用[1]）并返回刪除后的數(shù)組
            return function () {
                return t.myApply(_this, args)
            }
        }
        var a='window'
        var obj1={
            a: 'obj1',
            fn: function () {
                console.log(this.a)
                console.log(arguments)
            }
        }
        var obj2={
            a: 'obj2'
        }
        obj1.fn.myBind(obj2, 1, 2, 3, 4)() //obj2  arguments[1, 2, 3, 4]
        obj1.fn.myBind(this, 3, 2, 1)() //window  arguments[3, 2, 1]

對(duì)mvvm，mvp和mvc的理解

Model–View–ViewModel(MVVM)，Model-View-Presenter（MVP）和Model–View-Controller（MVC） 都是軟件架構(gòu)設(shè)計(jì)模式

相同的地方

• Model 是指任何一個(gè)領(lǐng)域模型(domain model)，一般做數(shù)據(jù)處理，可以理解為數(shù)據(jù)庫(kù)，用來(lái)存放應(yīng)用的所有數(shù)據(jù)對(duì)象。模型不必知曉視圖和控制器的細(xì)節(jié)，模型只需包含數(shù)據(jù)及直接和這些數(shù)據(jù)相關(guān)的邏輯。任何事件處理代碼、視圖模版，以及那些和模型無(wú)關(guān)的邏輯都應(yīng)當(dāng)隔離在模型之外，它代表了真實(shí)情況的內(nèi)容（一個(gè)面向?qū)ο蟮姆椒ǎ虮硎緝?nèi)容（以數(shù)據(jù)為中心的方法）的數(shù)據(jù)訪問層
• View就是用戶界面（UI），視圖層是呈現(xiàn)給用戶的，用戶與之產(chǎn)生交互。在javaScript應(yīng)用中，視圖大都是由html、css和JavaScript模版組成的。除了模版中簡(jiǎn)單的條件語(yǔ)句之外，視圖不應(yīng)當(dāng)包含任何其他邏輯。事實(shí)上和模型類似，視圖也應(yīng)該從應(yīng)用的其他部分中解耦出來(lái)

不同的地方

• MVC的Controller控制器是模型和視圖的紐帶。控制器從視圖獲得事件和輸入，對(duì)它們進(jìn)行處理，并相應(yīng)地更新視圖。當(dāng)頁(yè)面加載時(shí)，控制器會(huì)給視圖添加事件監(jiān)聽，比如監(jiān)聽表單提交和按鈕單擊。然后當(dāng)用戶和應(yīng)用產(chǎn)生交互時(shí)，控制器中的事件觸發(fā)器就開始工作。
• MVVM的ViewModel是一個(gè)公開公共屬性和命令的抽象的view。取代了 MVC 模式的 controller，或 MVP 模式的任命者(presenter)，MVVM 有一個(gè)驅(qū)動(dòng)。 在 viewmodel 中，這種驅(qū)動(dòng)傳達(dá)視圖和數(shù)據(jù)綁定的通信。此 viewmodel 已被描述為該 model 中的數(shù)據(jù)的狀態(tài)。
• MVP的Presenter負(fù)責(zé)邏輯的處理，在MVP中View并不直接使用Model，它們之間的通信是通過Presenter來(lái)進(jìn)行的，所有的交互都發(fā)生在Presenter內(nèi)部，而 在MVC中View會(huì)直接從Model中讀取數(shù)據(jù)而不是通過Controller。

談?wù)剬?duì)前端頁(yè)面渲染的理解（過程，原理，性能，重繪和回流）

頁(yè)面渲染分為以下步驟
1. 處理HTML語(yǔ)句標(biāo)簽并構(gòu)建 DOM 樹
2. 處理CSS語(yǔ)句并構(gòu)建CSSOM樹
3. 將處理好的DOM與CSSOM合并成一個(gè)渲染樹
4. 根據(jù)渲染樹來(lái)布局，計(jì)算每個(gè)節(jié)點(diǎn)的位置樣式等等
5. 調(diào) GPU（顯卡）繪制頁(yè)面，合成圖層，最后顯示在瀏覽器

在處理CSSOM時(shí)，會(huì)暫時(shí)堵塞DOM渲染，并且扁平層級(jí)關(guān)系有利于渲染速度，越詳細(xì)的樣式選擇器，會(huì)導(dǎo)致頁(yè)面渲染越慢
CSS加載會(huì)影響JS文件或語(yǔ)句加載，JS需要等待CSS解析完畢后運(yùn)行

document中的DOMContentLoaded和Load的區(qū)別?：前者只需HTML加載完成后，就會(huì)觸發(fā)，后者需要等HTML，CSS，JS都加載完成才會(huì)觸發(fā)?????

圖層概念：普通文檔流就是一個(gè)圖層，特定的屬性可以生成一個(gè)新的圖層。 不同的圖層渲染互不影響，所以對(duì)于某些頻繁需要渲染的建議單獨(dú)生成一個(gè)新圖層，提高性能。但也不能生成過多的圖層，會(huì)引起反作用
以下CSS屬性可以生成新圖層：

• 3D 變換：translate3d、translateZ
• will-change
• video、iframe 標(biāo)簽
• 通過動(dòng)畫實(shí)現(xiàn)的 opacity 動(dòng)畫轉(zhuǎn)換
• position: fixed

重繪（Repaint）和回流（Reflow）
重繪是當(dāng)節(jié)點(diǎn)需要更改外觀而不會(huì)影響布局的，比如改變color就叫稱為重繪回流是布局或者幾何屬性需要改變就稱為回流。
回流必定會(huì)發(fā)生重繪，重繪不一定會(huì)引發(fā)回流。
回流所需的成本比重繪高的多，改變深層次的節(jié)點(diǎn)很可能導(dǎo)致父節(jié)點(diǎn)的一系列回流。

所以以下幾個(gè)動(dòng)作可能會(huì)導(dǎo)致性能問題：

• 改變 window 大小
• 改變字體
• 添加或刪除樣式
• 文字改變
• 定位或者浮動(dòng)
• 盒模型

如何減少重繪和回流

• 使用 translate 替代 top
• 使用 visibility 替換 display: none ，因?yàn)榍罢咧粫?huì)引起重繪，后者會(huì)引發(fā) 回流（改變了布局）
• 把DOM離線后修改，比如：先把DOM給display:none（回流），然后你修改100次，然后再把它顯示出來(lái)
• 不要把 DOM 結(jié)點(diǎn)的屬性值放在一個(gè)循環(huán)里當(dāng)成循環(huán)里的變量
• 不要使用 table 布局，可能很小的一個(gè)小改動(dòng)會(huì)造成整個(gè) table 的重新布局
• 動(dòng)畫實(shí)現(xiàn)的速度的選擇，動(dòng)畫速度越快，回流次數(shù)越多，也可以選擇使用requestAnimationFrame
• CSS 選擇符從右往左匹配查找，避免 DOM 深度過深
• 將頻繁運(yùn)行的動(dòng)畫變?yōu)閳D層，圖層能夠阻止該節(jié)點(diǎn)回流影響別的元素。比如對(duì) 于 video 標(biāo)簽，瀏覽器會(huì)自動(dòng)將該節(jié)點(diǎn)變?yōu)閳D層。

談?wù)剬?duì)前端繼承的理解

原型鏈繼承，子類實(shí)例繼承的屬性有，子類構(gòu)造函數(shù)的屬性，父類構(gòu)造函數(shù)的屬性，父類原型上的屬性
缺點(diǎn)：無(wú)法向父類傳參，當(dāng)父類原型上的屬性改變時(shí)，所以子類實(shí)例相對(duì)應(yīng)的屬性都會(huì)對(duì)應(yīng)改變

        function Father() {
            this.name="father";
            this.sex="man"
        }
        Father.prototype.hobby='fish'
 
        function Son() {
            this.name="son";
        }
        // 原型鏈繼承
        Son.prototype=new Father()
        var son1=new Son()
        var son2=new Son()
        Father.prototype.hobby='dog' //缺點(diǎn)，修改父類prototype上的屬性時(shí)，所有子類都會(huì)隨之修改
        console.log(son1.hobby) // dog
        console.log(son2.hobby) // dog
        console.log(son1 instanceof Father) // true

構(gòu)造函數(shù)繼承（通過call，apply），子類可繼承多個(gè)父類，可傳參給父類
缺點(diǎn)：每個(gè)實(shí)例都有父類的構(gòu)造函數(shù)，父類prototype上的屬性無(wú)法繼承

        // 構(gòu)造函數(shù)繼承（通過call，apply）
        function Father() {
            this.name="father";
            this.sex="man"
        }
        Father.prototype.hobby='fish'
        function Son(sex) {
            Father.call(this, sex) //可繼承多個(gè)父類,但是每個(gè)實(shí)例都有父類的構(gòu)造函數(shù)
            this.name="son";
        }
        var son=new Son('woman')
        console.log(son.sex) //woman,可傳參給父類
        console.log(son.hobby) //undefined，缺點(diǎn)，父類prototype上的屬性無(wú)法繼承
        console.log(son instanceof Father) // false

組合繼承，上述兩者的結(jié)合，解決了上面的缺點(diǎn)和問題（常用）
缺點(diǎn)：Father.call()和new Father()執(zhí)行了兩次父類構(gòu)造函數(shù)，增加了性能損耗，父類的原型上的constructor指向了子類，此時(shí)需要在實(shí)例化父類（new Father）后在實(shí)例化子類（new Son）之前添加一句話：Father.prototype.constructor=Father

        // 組合繼承
        function Father(sex) {
            this.name="father";
            this.sex=sex
        }
        Father.prototype.hobby='fish'
 
        function Son(sex) {
            Father.call(this, sex) //可繼承多個(gè)父類
            this.name="son";
        }
        Son.prototype=new Father()
        Father.prototype.constructor=Father //解決父類的原型上的constructor指向了子類
        var son=new Son('woman')
        console.log(son.sex) //woman,可傳參給父類
        console.log(son.hobby) //fish
        console.log(son instanceof Father) // true

原型式繼承，和Object.create相似，通過函數(shù)進(jìn)行繼承，會(huì)繼承父類所有屬性
缺點(diǎn)：父類原型上的屬性發(fā)生變化時(shí)，所有子類對(duì)應(yīng)屬性都會(huì)改變，子類無(wú)法直接修改屬性，復(fù)用性較差

        // 原型式繼承
        function Father() {
            this.name="father";
            this.sex='man'
        }
        Father.prototype.hobby='fish'
 
        function Son() {
            this.name="son";
        }
 
        function inherit(father) {
            function Fn() {}
            Fn.prototype=father;
            return new Fn() //類似于復(fù)制了father這個(gè)對(duì)象
        }
        var father=new Father()
        var son1=inherit(father)
        Father.prototype.hobby='dog' //缺點(diǎn)，修改父類prototype上的屬性時(shí)，所有子類都會(huì)隨之修改
        var son2=inherit(father)
        console.log(son1.sex) //man
        console.log(son1.hobby) //dog
        console.log(son2.hobby) //dog
        console.log(son1 instanceof Father) // true

寄生式繼承，繼承父類所有屬性，并且可以添加子類自己的屬性方法
缺點(diǎn)：代碼復(fù)用率低

        function Father(sex) {
            this.name="father";
            this.sex=sex //實(shí)例傳參
        }
        Father.prototype.hobby='fish'
 
        function Son() {
            this.name="son";
        }
        Object.prototype.myCreate=function (obj) {//實(shí)現(xiàn)Object.create
            function Fn() {}
            Fn.prototype=obj;
            return new Fn()
        }
 
        function inherit(father) {
            var _father=Object.myCreate(father)//克隆對(duì)象
            _father.getInfo=function () {//增強(qiáng)子類，修改屬性，產(chǎn)生子類獨(dú)有的方法和屬性，但是耦合高，復(fù)用性差，不同子類的寫法各不同
                console.log(_father.name)
                console.log(_father.hobby)
                console.log(_father.sex)
            }
            return _father;
        }
        var father=new Father('woman')
        var son=inherit(father)
        son.getInfo() //father，fish，woman

寄生式組合繼承，繼承父類所有屬性，解決調(diào)用兩次父類構(gòu)造函數(shù)問題：一次是在創(chuàng)建子類型原型，一次在子類內(nèi)部（理論上是最理想的繼承）

        // 寄生式組合繼承
        function Father(sex) {
            this.name="father";
            this.sex=sex //實(shí)例傳參
        }
        Father.prototype.hobby='fish'
        Father.prototype.getName=function () {
            console.log(this.name)
        }
 
        function Son(sex) {
            console.log(this.superClass) //Father
            Father.call(this, sex); //構(gòu)造函數(shù)繼承傳遞參數(shù)
            this.name="son";
            this.hobby="dog";
        }
        Son.prototype.getName=function () {
            console.log(this.name)
        }
 
        function Grandson(sex) {
            console.log(this.superClass) //Son
            Son.call(this, sex); //構(gòu)造函數(shù)繼承傳遞參數(shù)
            this.name="grandson";
            this.hobby="cat";
        }
 
        var inherit=(function () {
            function F() {} //使用閉包產(chǎn)生私有函數(shù)，使每個(gè)子類繼承的父類屬性無(wú)引用關(guān)系
            return function (father, son) {
                F.prototype=father.prototype; //私有函數(shù)取出父類的原型
                son.prototype=new F();
                son.prototype.superClass=father; //子類的超類指向父類，子類通過this.superClass調(diào)用Father
                son.prototype.constructor=son;
            }
        }())
        inherit(Father, Son)
        inherit(Son, Grandson)
        var father=new Father('fatherMan')
        var son=new Son('sonMan')
        var grandson=new Grandson('grandsonMan')
        console.log(son instanceof Father) //true
        console.log(grandson instanceof Son) //true
        console.log(grandson instanceof Father) //true
        console.log(father.sex) //fatherMan
        console.log(son.sex) //sonMan
        console.log(grandson.sex) //grandsonMan
        console.log(father.hobby) //fish
        console.log(son.hobby) //dog
        console.log(grandson.hobby) //cat
        father.getName() //father
        son.getName() //son
        grandson.getName() //grandson

原文鏈接：https://blog.csdn.net/time_____/article/details/109525973?utm_medium=distribute.pc_category.none-task-blog-hot-5.nonecase&depth_1-utm_source=distribute.pc_category.none-task-blog-hot-5.nonecase

作者：DieHunter1024

出處：CSDN

記得剛開始學(xué)習(xí)編程時(shí)，我就在想：“Java和JavaScript是同一種語(yǔ)言嗎？”。就是因?yàn)榭吹剿鼈兠Q中都帶“java”，所以才會(huì)誤以為它們有關(guān)系。實(shí)際上，它們并沒有太大的聯(lián)系。

這兩者的關(guān)系，就和英語(yǔ)與斯瓦希里語(yǔ)「非洲語(yǔ)言使用人口最多的語(yǔ)言之一，簡(jiǎn)稱斯語(yǔ)」類似。兩者都是語(yǔ)言，但是語(yǔ)法、用詞甚至語(yǔ)音都完全不同。與英語(yǔ)和斯語(yǔ)相比，Java和JavaScript的區(qū)別其實(shí)更大。英語(yǔ)和斯語(yǔ)是大部分人日常互相交流溝通的語(yǔ)言。但是，java和JavaScript是計(jì)算機(jī)語(yǔ)言，具有不同的交流方式。

>>不同之處

1、命名

JavaScript是由Netscape公司設(shè)計(jì)實(shí)現(xiàn)而成的。JavaScript最初被稱為Mocha，然后更名為L(zhǎng)iveScript。Netscape公司與Sun公司合作，Netscape高層希望它看上去能夠像Java，因此才取名為JavaScript。其實(shí)JavaScript走的一直是依靠大IP普及的營(yíng)銷策略，正如一開始我們所疑惑的地方一樣，JavaScript就是依靠類似java的名稱才被大眾所熟知。就是靠著這一點(diǎn)，現(xiàn)在JavaScript已經(jīng)是世界上第三流行的語(yǔ)言，并且人氣還在不斷上升。

Java是由Oracle公司（以前由Sun Microsystems）提供支持。而Java最初被稱為Oak，然后更名為Green，后來(lái)才改成當(dāng)前的名稱Java。而java雖說是使用最廣泛的語(yǔ)言之一，但近年來(lái)人氣卻在緩慢下降。

2、應(yīng)用范圍

Java具有極廣的通用性，幾乎在任何地方都可以使用;而JavaScript主要用于帶有一些牽引服務(wù)器端「Node」，移動(dòng)端「React Native」和桌面端「Electron」的前端Web開發(fā)。

3、語(yǔ)言特性

JavaScript是一種腳本語(yǔ)言，很多知名的瀏覽器都對(duì)Js有非常良好的本地支持，所以它成為了最受歡迎的前端語(yǔ)言之一；而Java是一種面向?qū)ο蟮母呒?jí)編程語(yǔ)言，不適合作前端開發(fā)。

4、基于對(duì)象和面向?qū)ο?/span>

Java可以編寫桌面應(yīng)用程序、Web應(yīng)用程序、分布式系統(tǒng)和嵌入式系統(tǒng)應(yīng)用程序。它是一種真正的面向?qū)ο?Object Oriented)的語(yǔ)言，即便是開發(fā)簡(jiǎn)單的程序，也必須設(shè)計(jì)對(duì)象。

JavaScript是一種網(wǎng)絡(luò)腳本語(yǔ)言，常用來(lái)為網(wǎng)頁(yè)添加各式各樣的動(dòng)態(tài)功能，為用戶提供更流暢美觀的瀏覽效果。它可以使網(wǎng)頁(yè)具有交互性；并提供及時(shí)反饋節(jié)省用戶時(shí)間；還可以根據(jù)用戶的操作，動(dòng)態(tài)的創(chuàng)建頁(yè)面。它是一種基于對(duì)象(Object Based)和事件驅(qū)動(dòng)(Event Driver)的編程語(yǔ)言。

5、解釋和編譯

Java是一種編譯語(yǔ)言，即Java代碼被轉(zhuǎn)換為在語(yǔ)言虛擬機(jī)中執(zhí)行字節(jié)碼。Java的源代碼在執(zhí)行之前，必須經(jīng)過編譯。

JavaScript是一種解釋性編程語(yǔ)言，其源代碼不需經(jīng)過編譯，由瀏覽器解釋執(zhí)行。（目前的瀏覽器幾乎都使用了JIT（即時(shí)編譯）技術(shù)來(lái)提升JavaScript的運(yùn)行效率）

6、檢測(cè)代碼

Java是強(qiáng)類型的靜態(tài)語(yǔ)言，每個(gè)變量必須預(yù)先指定其類型。JavaScript是弱類型的動(dòng)態(tài)語(yǔ)言，其變量可以根據(jù)賦值而改變類型，如：var s=10；那么s為int型。JavaScript使用動(dòng)態(tài)類型檢查，即它是在執(zhí)行JavaScript代碼時(shí)檢查變量的類型。這樣做有一個(gè)好處就是可以使程序員更容易編碼。而Java使用靜態(tài)類型檢查，即它是在編譯時(shí)驗(yàn)證變量的類型。也就是說，它要檢測(cè)的錯(cuò)誤代碼更少！

7、代碼格式

JavaScript與Java代碼格式不一樣。JavaScript的代碼是一種文本字符格式，可以直接嵌入HTML文檔中，并且可動(dòng)態(tài)裝載。Java是一種與HTML無(wú)關(guān)的格式，必須通過像HTML中引用外媒體那樣進(jìn)行裝載，其代碼以字節(jié)代碼的形式保存在獨(dú)立的文檔中，其獨(dú)立文件的格式為*.class。

8、線程

JavaScript不支持多線程，因?yàn)闉g覽器中的JavaScript解釋器是單線程的。而Java則支持多線程。

9、圖文操作

Java可以直接對(duì)文本和圖形進(jìn)行操作。而JavaScript是通過在Web頁(yè)面中與HTML元素組合來(lái)發(fā)揮作用的，但JaveScrit可以控制瀏覽器，讓瀏覽器直接對(duì)文本和圖形進(jìn)行處理。

10.工作機(jī)會(huì)

Java比JavaScript有更多的工作機(jī)會(huì)。根據(jù)數(shù)據(jù)，在中國(guó)Java開發(fā)發(fā)布了21094個(gè)職位，而JavaScript開發(fā)只發(fā)布了8486個(gè)職位。相比較而言，Java更適合你尋找工作。

了解java和JavaScript的不同之處，其實(shí)并沒有其他的意義，重要的是要通過清楚他們不同之處，明白什么時(shí)候更適合用JavaScript，而哪些情況下則使用java。

那么，什么時(shí)候使用JavaScript和Java？

舉個(gè)例子來(lái)說，如何用java和JavaScript的方法實(shí)現(xiàn)讓孩子跳躍的操作？

按Java的方法：因?yàn)楹⒆勇牪欢疤保阅阋谒竽X的部分區(qū)域插入了一個(gè)控制跳躍功能的電極裝置。當(dāng)電極沖擊大腦時(shí)，他就會(huì)不由自主地跳動(dòng)。機(jī)器可以將你的指令轉(zhuǎn)化為腦信號(hào)，你只需要將其安裝在他身上，不需要借助其他的東西，就可以控制他完成“跳躍”動(dòng)作。

按JavaScript的方法：實(shí)現(xiàn)“跳躍”，其實(shí)只要教孩子如何跳躍。教完以后，當(dāng)你說“跳”時(shí)，他便知道要開始跳了。所以在JavaScript中，主要的還是你需要教他如何理解“跳”一詞。畢竟程序必須先知道如何解釋命令才能執(zhí)行。

回到我們的示例當(dāng)中，除了本身無(wú)法在大腦中插入電極裝置以外，將機(jī)器安裝在人身上，讓他遵循命令的行為是非常不可取的。而如果你教他理解命令，這樣的話，下次他一聽到這個(gè)命令，就能在沒有其他東西輔助的情況下工作。

人是如此，計(jì)算機(jī)亦是。為什么一直在強(qiáng)調(diào)解釋型的重要性，主要還是因?yàn)檫@樣相比較而言更容易編寫，但并不是所有時(shí)間都要使用JavaScript。

平日里遇到要用java或JavaScript進(jìn)行編寫時(shí)，我個(gè)人的建議是，JavaScript固然十分好用，但一定要是自律性很高的人才更適用，因?yàn)椋?dāng)你需要維護(hù)混亂無(wú)規(guī)則的JavaScript代碼時(shí)，就會(huì)發(fā)現(xiàn)，那簡(jiǎn)直是一場(chǎng)噩夢(mèng)。所以，我還是建議你優(yōu)先使用java來(lái)編寫程序。因?yàn)椋粘９ぷ鳟?dāng)中，你大可使用java編寫不受限的程序?yàn)g覽器。

凡事都有局限性，了解了java和JavaScript的不同之處，分清他們具體使用的時(shí)機(jī)，你就會(huì)更有效的完成手頭工作。

好啦，關(guān)于java和JavaScript不同之處的介紹就到此結(jié)束了。感謝你的閱讀！一味地在網(wǎng)絡(luò)上尋求學(xué)習(xí)方式和工作技巧，是不足以靜下心來(lái)完成學(xué)習(xí)和工作的。放下手機(jī)，著手開始執(zhí)行你制定好的計(jì)劃，相信自己一定會(huì)成功的。

者：訣九 前端名獅

轉(zhuǎn)發(fā)鏈接：https://mp.weixin.qq.com/s/BMg8bFUwa4gmm6v2acAe7Q