javascript
4.JavaScript对象和初始面向对象
?
?
JavaScript中的基本數(shù)據(jù)類型
-
-
- number(數(shù)值類型)
- string(字符串類型)
- boolean(布爾類型)
- null(空類型)
- undefined(未定義類型)
- object
-
?
- 屬性
- 方法
- 面向?qū)ο髢H僅是一個概念或者編程思想
- 通過一種叫做原型的方式來實現(xiàn)面向?qū)ο缶幊?/li>
?
基于Object對象的方式創(chuàng)建對象
語法：
var 對象名稱=new Object( );
示例：----------通過 ?. 添加屬性和方法
var flower=new Object();flower.name="長春花";flower.genera="夾竹桃科 長春花屬";flower.area="非洲、亞熱帶、熱帶以及中國大陸的華東、西南、中南等地";flower.uses="觀賞或用藥等";flower.showName=function(){ ???alert(this.name); ???}flower.showName();?
使用字面量賦值方式創(chuàng)建對象
示例：
var flower={name:"長春花",genera:"夾竹桃科 長春花屬",area:"非洲、亞熱帶、熱帶以及中國大陸的華東、西南、中南等地",uses:"觀賞或用藥等",showName:function(){ alert(this.name); }}flower.showName();?
常見的內(nèi)置對象：
String（字符串）對象
Date（日期）對象
Array（數(shù)組）對象
Boolean（邏輯）對象
Math（算數(shù)）對象
RegExp對象
練習：
實現(xiàn)思路
使用new創(chuàng)建對象person
????var person=new Object();
使用“.”添加屬性
???person.name="朗曉明";
????person.age="38";
使用+把各屬性的值拼接起來，使用innerHTML為頁面元素賦值
???var str="姓名："+this.name+"<br/>年齡："+this.age+"……;
簡寫：var str=this.name+this.age+……;
???document.getElementById("intro").innerHTML=str;
?
如何解決使用同一個接口不需要創(chuàng)建很多對象，減少產(chǎn)生大量的重復代碼？
構(gòu)造函數(shù)
原型對象
?
示例：
function Flower(name,genera,area,uses){this.name=name;…….this.showName=function(){alert(this.name);}}????var flower1=new Flower("長春花","夾竹桃科 長春花屬","非洲、亞熱帶、熱帶以及中國大陸的華東、西南、中南等地","觀賞或用藥等")
???flower1.showName();
?
示例：
var flower2=new Flower("牡丹","芍藥科 芍藥屬","中國","觀賞、食用或藥用");
flower2.showName();
var flower3=new Flower("曼陀羅花","茄科 曼陀羅屬","印度、中國北部","觀賞或藥用");
flower3.showName();
調(diào)用構(gòu)函數(shù)的4個步驟：
創(chuàng)建一個新對象
將構(gòu)造函數(shù)的作用域賦給新對象（this就指向了這個新對象）
執(zhí)行構(gòu)造函數(shù)中的代碼
返回新對象
?
constructor屬性指向Flower
示例：
alert (flower1.constructor==Flower);alert (flower2.constructor==Flower);alert (flower3.constructor==Flower);使用instanceof操作符檢測對象類型
alert(flower1 instanceof Object);alert(flower1 instanceof Flower);alert(flower2 instanceof Object);alert(flower2 instanceof Flower);alert(flower3 instanceof Object);alert(flower3 instanceof Flower);?
示例：
function Flower(){}Flower.prototype.name="曼陀羅花";Flower.prototype.genera="茄科 曼陀羅屬";Flower.prototype.area="印度、中國北部";Flower.prototype.uses="觀賞或藥用";Flower.prototype.showName=function() {alert(this.name);}var flower1=new Flower();flower1.showName();var flower2=new Flower();flower2.showName();alert(flower1.showName==flower2.showName);?
示例：
function Flower(){}Flower.prototype.name="曼陀羅花";Flower.prototype.genera="茄科 曼陀羅屬";Flower.prototype.area="印度、中國北部";Flower.prototype.uses="觀賞或藥用";Flower.prototype.showName=function() {alert(this.name);}var flower1=new Flower();var flower2=new Flower();flower1.name="長春花";alert(flower1.name);alert(flower2.name);?
?
示例：
function Humans(){this.foot=2;}Humans.prototype.getFoot=function(){return this.foot;}function Man(){this.head=1;}Man.prototype=new Humans(); ?????????//繼承了HumansMan.prototype.getHead=function(){return this.head;}var man1=new Man();alert(man1.getFoot()); ?????????????????????????//2alert(man1 instanceof Object); ?????????//true ????alert(man1 instanceof Humans); ???????//truealert(man1 instanceof Man); ?????????//true?
構(gòu)造函數(shù)和原型之間的關系
?
調(diào)用man1.getFoot( ) 經(jīng)歷的三個步驟：
搜索實例
搜索Man.prototype
搜索Humans.prototype
?
Object在原型鏈中的位置
示例：
?function Humans(){this.clothing=["trousers","dress","jacket"];}function Man(){ ????}//繼承了HumansMan.prototype=new Humans();var man1=new Man();man1.clothing.push("coat");alert(man1.clothing);var man2=new Man();alert(man2.clothing);?
語法：
apply([thisOjb[,argArray]])
應用某一對象的一個方法，用另一個對象替換當前對象
語法：
call([thisObj[,arg1[,arg2[, ?[,argN]]]]])
調(diào)用一個對象的一個方法，以另一個對象替換當前對象
?
示例：??
function Humans(name){this.name=name;}function Man(){Humans.call(this,"mary"); ??//繼承了Humans,同時還傳遞了參數(shù)this.age=38; ?????????????//實例屬性}var man1=new Man();alert(man1.name); ??????//輸出maryalert(man1.age); ???????//輸出38?
組合繼承：有時也叫做偽經(jīng)典繼承
-
-
- 將原型鏈和借用構(gòu)造函數(shù)的技術(shù)組合到一塊，發(fā)揮二者之長的一種繼承模式
- 使用原型鏈實現(xiàn)對原型屬性和方法的繼承，而通過借用構(gòu)造函數(shù)來實現(xiàn)對實例屬性的繼承
-
?
?
總結(jié)
以上是生活随笔為你收集整理的4.JavaScript对象和初始面向对象的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Torch和torchvision的安装
- 下一篇： JS的数据类型分类以及用法，没有这些基础