问题1: OOP 指什么?有哪些特性?
OOP,Object Oriented Programming,面向对象编程。
特性:开放和封闭原则,三个要素,封装、继承、多态
开放和封闭原则:
- open for extension 对于扩展是开放的。当需求改变时,可以对模块进行扩展,使其具有满足那些改变的新行为。
- closed for modification 对于修改是封闭的。对模块进行扩展时,不必改动模块的源代码或二进制代码
函数会形成独立的作用域,用函数将代码封装,方便使用,对全局作用域的影响减少。
因为继承,后代可以获得父代的全部属性和方法
多态,同一个方法可以有不同的表现。比如通过new两个实例,可以分别对里面的方法函数扩展,得到的结果不同,但是,这都属于同一个方法。
问题2: 如何通过构造函数的方式创建一个拥有属性和方法的对象?
function People(name,age){
this.name = name
this.age = age
this.sayName = function(){
console.log(this.name)
}
}
var p = new People('hunger','20')
p.sayName() //hunger
问题3: prototype 是什么?有什么特性?
每个实例对象继承自另一个对象,后者被称为原型对象,原型对象上的属性和方法都能被实例对象拥有。
例:
function Person(name,age){
this.name = name,
this.age = age
}
Person.prototype.getName = function(){
console.log(this.name)
}
var p = new Person() //这时p是构造函数的一个实例,里面有一个__proto__属性,指向Person.prototype,并继承Person的全部属性和方法,这里Person为p的原型对象。
问题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('前端');
原型图.png
问题5: 创建一个 Car 对象,拥有属性name、color、status;拥有方法run,stop,getStatus
function Car(name,color,status){
this.name = name
this.color = color
this.status = status
this.run = function(){}
this.stop = function(){}
this.getStatus = function(){}
}
var car = new Car
问题6: 创建一个 GoTop 对象,当 new 一个 GotTop 对象则会在页面上创建一个回到顶部的元素,点击页面滚动到顶部。拥有以下属性和方法
1. `ct`属性,GoTop 对应的 DOM 元素的容器
2. `target`属性, GoTop 对应的 DOM 元素
3. `bindEvent` 方法, 用于绑定事件
4 `createNode` 方法, 用于在容器内创建节点
function GoTop(){
var content = document.createElement('div')
content.setAttribute('class','ct')
var target = document.createElement('div')
var node = document.createTextNode('target')
target.appendChild(node)
target.setAttribute('class','target')
this.ct = content
this.target = target
this.bindEvent = function(){
this.ct.onclick = function(){
document.body.scrollTop = 0
}
}
this.createNode = function(){
this.ct.append(this.target)
document.body.append(this.ct)
}
this.createNode()
this.bindEvent()
}
网友评论