問(wèn)題1： OOP 指什么医寿？有哪些特性

• OOP（Object oriented Programming）指面向?qū)ο缶幊蹋詫?duì)象為基本蘑斧，通過(guò)類(lèi)和繼承靖秩，實(shí)現(xiàn)相應(yīng)的功能，并通過(guò)實(shí)例化進(jìn)行相應(yīng)的操作竖瘾。

主要特性

1. 封裝：將類(lèi)的使用和實(shí)現(xiàn)分開(kāi)沟突，只保留部分接口和方法與外界聯(lián)系

2.繼承：子類(lèi)自動(dòng)繼承父類(lèi)中的屬性和方法，并可以添加新的屬性和方法或者對(duì)部分的屬性和方法進(jìn)行重寫(xiě)捕传，增加代碼的可重復(fù)性

3.多態(tài)： 子類(lèi)繼承來(lái)自祖父類(lèi)的方法和屬性惠拭，對(duì)其中一部分進(jìn)行重寫(xiě)

問(wèn)題2： 如何通過(guò)構(gòu)造函數(shù)的方式創(chuàng)建一個(gè)擁有屬性和方法的對(duì)象?

        function Person(name, age) {
            this.name = name
            this.age = age
            this.printName = function() {
                console.log(this.name)
            }
        }
        var person1 = new Person('卉', 26)
        var person2 = new Person('慧', 24)

        person1.printName()
        person2.printName()

問(wèn)題3： prototype 是什么？有什么特性

• 通過(guò)構(gòu)造函數(shù)創(chuàng)建的對(duì)象實(shí)例的原型對(duì)象庸论，通常用于存放公共屬性和方法求橄，可以節(jié)省內(nèi)存，當(dāng)有很多對(duì)象的時(shí)候葡公，不要每一個(gè)對(duì)象都重復(fù)去創(chuàng)建一個(gè)方法罐农。

• 每一個(gè)函數(shù)都有一個(gè) prototype ,這個(gè)屬性最終指向函數(shù)的構(gòu)造函數(shù) Function.prototype , 里面有很多常用的公共方法，比如reduce催什、map涵亏、sert、filter等。

特性：

1. 每一個(gè)函數(shù)都有一個(gè) prototype 屬性气筋，指向一個(gè)原型對(duì)象
2. prototype 一旦更改拆内，將影響其所有的實(shí)例化對(duì)象的方法
3. 所有對(duì)象都有__proto__
4. 對(duì)象的 __proto__等于構(gòu)造函數(shù).prototype
5. 訪問(wèn)一個(gè)對(duì)象屬性時(shí)，如果對(duì)象有這個(gè)屬性宠默，就獲取麸恍，就一直去上一層的__proto__里面找

問(wèn)題4：畫(huà)出如下代碼的原型圖

function People (name){
  this.name = name;
  this.sayName = function(){
    console.log('my name is:' + this.name);
  }
}

People.prototype.walk = function(){
  console.log(this.name + ' is walking');  
}

var p1 = new People('饑人谷');
var p2 = new People('前端');

問(wèn)題5： 創(chuàng)建一個(gè) Car 對(duì)象，擁有屬性name搀矫、color抹沪、status；擁有方法run瓤球，stop融欧，getStatus

function Person(name, age) {
            this.name = name
            this.age = age
            this.printName = function() {
                console.log(this.name)
            }
        }
        var person1 = new Person('卉', 26)
        var person2 = new Person('慧', 24)
        person1.age
        person1.printName()
        person2.printName()

        function Car(name, color, status) {
            this.name = name
            this.color = color
            this.status = status
        }
        Car.prototype.run = function() {
            console.log('run')
        }
        Car.prototype.stop = function() {
            console.log('stop')
        }
        Car.prototype.getStatus = function() {
            console.log(this.status)
        }

        // Car.prototype = {
        //  run: function() {
        //      console.log('run')
        //  },
        //  stop: function() {
        //      console.log('stop')
        //  }, 
        //  getStatus: function() {
        //      console.log(this.status)
        //  }
        }

        var car1 = new Car('寶馬', '紅色', '行進(jìn)')
        car1.run()
        car1.getStatus()

問(wèn)題6： 創(chuàng)建一個(gè) GoTop 對(duì)象，當(dāng) new 一個(gè) GotTop 對(duì)象則會(huì)在頁(yè)面上創(chuàng)建一個(gè)回到頂部的元素卦羡，點(diǎn)擊頁(yè)面滾動(dòng)到頂部噪馏。擁有以下屬性和方法

1.  `ct`屬性，GoTop 對(duì)應(yīng)的 DOM 元素的容器
2.  `target`屬性绿饵， GoTop 對(duì)應(yīng)的 DOM 元素
3.  `bindEvent` 方法欠肾， 用于綁定事件
4.  `createNode` 方法， 用于在容器內(nèi)創(chuàng)建節(jié)點(diǎn)

代碼

效果

問(wèn)題7： 使用木桶布局實(shí)現(xiàn)一個(gè)圖片墻

代碼

效果