問題1: OOP 指什么?有哪些特性
OOP:(Object Oriented Programming)面向?qū)ο缶幊蹋?特性:萬物皆對象;目的:1汇在、改善可讀性殖告;2羡洁、提高重用性;
原則:開放封閉原則:對于擴展是開放的,就是添加新功能就是添加新demo好了秸应,不必改整個demo;對于修改是封閉的,就是不準改動原來的事物的demo盈罐。
三要素:
1钓葫、封裝:就是將一堆屬性或方法封裝成對象或類;
2番刊、繼承:子類可以向上繼承父類枣抱,從而擁有父類相關(guān)的屬性和方法;
3轿秧、多態(tài):不同的事物對于同一個方法有不同的表現(xiàn)吱型,相當(dāng)于Array.length和Function.length的length表現(xiàn)的意思是不一樣的铝侵,一個是數(shù)組的長度,一個是函數(shù)的參數(shù)的個數(shù)颖侄。但是對于它們而言炊琉,方法都是同一個锰悼,是length丝里。但是表現(xiàn)卻不一樣营密。
問題2: 如何通過構(gòu)造函數(shù)的方式創(chuàng)建一個擁有屬性和方法的對象?
var Foo=function(){
this.name='komo'
this.say=function(){
console.log('xixi')
}
}
var foo= new Foo(); //這個是綁定到自己身上的
var Foo=function(){
this.name='komo'
this.sayName();
}
Foo.prototype={
sayName:function(){ console.log('xixi');},
}
var foo= new Foo(); //這個是綁定到prototype上的
問題3: prototype 是什么?有什么特性
prototype是原型對象。就是js中的對象都是繼承另一個對象的,而后這個對象就被稱為“原型對象”;
特性:
1、在Javascript中所有的Javascript對象都有原型畔勤,就是都有prototype妨托。
2脆贵、同時原型也是個對象筒捺。
3肯尺、函數(shù)都有prototype對象。同時所有的對象的內(nèi)部都會有一個屬性(-proto-)去鏈接到另一個對象,直到鏈接到一個以null為原型的對象。因為規(guī)定null沒有原型捉蚤,同時作為原型鏈的終點题暖。所以函數(shù)中會有prototype和_proto_。
4、其上面的屬性和方法祠够,都會被繼承的對象所擁有。
問題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('前端');
XOUX)9[M1FU`N5~DIC7M]0P.png
問題5: 創(chuàng)建一個 Car 對象赵哲,擁有屬性name较坛、color耙厚、status;擁有方法run略水,stop床嫌,getStatus
var Car=function(name,color,status){ //function Car() {
this.name=name;
this.color=color;
this.status=status;
run: function(){ }, //還有就是不是寫:,而是= ,改為run=function(){}
stop: function(){}, //注意不要寫;葫掉,這個是, stop=function(){}
getStatus:function(){ console.log(this.status}
} //改為getStatus=function(){}
var car =new Car();
var Car=function(name,color,status){ //function Car() {
this.name=name;
this.color=color;
this.status=status;
this.run();
this.stop();}
Car.prototype={
run: function(){},
stop: function(){},
getStatus:function(){
console.log(this.status);
}
}
var car =new Car('komo','red',6666);
問題6: 創(chuàng)建一個 GoTop 對象,當(dāng) new 一個 GotTop 對象則會在頁面上創(chuàng)建一個回到頂部的元素尖飞,點擊頁面滾動到頂部窍奋。擁有以下屬性和方法
-
ct
屬性,GoTop 對應(yīng)的 DOM 元素的容器 -
target
屬性在张, GoTop 對應(yīng)的 DOM 元素 -
bindEvent
方法, 用于綁定事件 -
createNode
方法, 用于在容器內(nèi)創(chuàng)建節(jié)點
demo
Effect
> function GoTop(){
var btn=document.creatElement('button')
btn.addEventListener('click',function(){window.scrollTo(0,0)},false)
this.ct=this.parentElement;
this.target=this.nodeName;
this.bindEvent=function(){ this.addEventListener('click',function(){console.log(1);},false)
}
this.createNode=function(){
var a=document.createElement('div');
this.parentElement.appendChild(a);}
}
var gotop=new GoTop();