高级任务一

问题1： OOP 指什么？有哪些特性

• OOP（Object oriented Programming）指面向对象编程，以对象为基本，通过类和继承，实现相应的功能，并通过实例化进行相应的操作。

主要特性

1. 封装：将类的使用和实现分开，只保留部分接口和方法与外界联系

2.继承：子类自动继承父类中的属性和方法，并可以添加新的属性和方法或者对部分的属性和方法进行重写，增加代码的可重复性

3.多态： 子类继承来自祖父类的方法和属性，对其中一部分进行重写

问题2： 如何通过构造函数的方式创建一个拥有属性和方法的对象?

        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()

问题3： prototype 是什么？有什么特性

• 通过构造函数创建的对象实例的原型对象，通常用于存放公共属性和方法，可以节省内存，当有很多对象的时候，不要每一个对象都重复去创建一个方法。

• 每一个函数都有一个 prototype ,这个属性最终指向函数的构造函数 Function.prototype , 里面有很多常用的公共方法，比如reduce、map、sert、filter等。

特性：

1. 每一个函数都有一个 prototype 属性，指向一个原型对象
2. prototype 一旦更改，将影响其所有的实例化对象的方法
3. 所有对象都有__proto__
4. 对象的 __proto__等于构造函数.prototype
5. 访问一个对象属性时，如果对象有这个属性，就获取，就一直去上一层的__proto__里面找

问题4：画出如下代码的原型图

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('前端');

问题5： 创建一个 Car 对象，拥有属性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('宝马', '红色', '行进')
        car1.run()
        car1.getStatus()

问题6： 创建一个 GoTop 对象，当 new 一个 GotTop 对象则会在页面上创建一个回到顶部的元素，点击页面滚动到顶部。拥有以下属性和方法

1.  `ct`属性，GoTop 对应的 DOM 元素的容器
2.  `target`属性， GoTop 对应的 DOM 元素
3.  `bindEvent` 方法， 用于绑定事件
4.  `createNode` 方法， 用于在容器内创建节点

代码

效果

问题7： 使用木桶布局实现一个图片墙

代码

效果