Ⅰ 新手如何理解JS面向對象開發
技術不是很好,怕是要誤人子弟
舉個例子
比方說一個游戲裡面有「玩家」,版而「玩家」就有血量權、飢餓等屬性。
於是便可以把「玩家」作為一個對象:
var player = {heath: 100, hunger:100}
你會發現「對象」是幾種不同值的存儲器。
然後你就可以用player.health來獲取血量,player.hunger來獲取飢餓
player.health = xx 以及 player.hunger = xx 來設置
但是當多人游戲時,會有很多「玩家」,然後你發現創建對象很麻煩,而且也不夠「優雅」。
於是,就有了「構造方法」
不想寫了。。接下來自己查教程了解,相信你會恍然大悟的
Ⅱ js面向對象的幾種方式
JavaScript中對象的創建有以下幾種方式:
(1)使用內置對象
(2)使用JSON符號
(3)自定義對象構造
一、使用內置對象
JavaScript可用的內置對象可分為兩種:
1,JavaScript語言原生對象(語言級對象),如String、Object、Function等;
2,JavaScript運行期的宿主對象(環境宿主級對象),如window、document、body等。
我們所說的使用內置對象,是指通過JavaScript語言原生對象的構造方法,實例化出一個新的對象。如:
復制代碼 代碼如下:
var str = new String("實例初始化String");
var str1 = "直接賦值的String";
var func = new Function("x","alert(x)");//示例初始化func
var o = new Object();//示例初始化一個Object
二、使用JSON符號
(i)何謂JSON ?
JSON (JavaScript Object
Notation)即JavaScript對象命名,是一種輕量級的數據交換格式,易於閱讀和編寫,同時也易於及其解析和生成。它基於
《JavaScript Programming Language, Standard ECMA-262 3rd Edition -
December 1999》的一個子集。JSON是完全獨立於語言的文本格式,因此成為數據交換的理想格式。
JSON作為
JavaScript的一個自己,同時ActionScript、C、C#、ColdFusion、E、Java、JavaScript、ML、
ObjectiveCAML、Perl、PHP、Python、Rebol、Ruby、Lua等一系列的語言都提供支持,使得JSON成為Ajax開發的
首選方案。
JSON有兩種構建方式,一種是採用簡單的「鍵/值對」的集合,在不同的語言中被理解為對象、記錄、結構、字典、哈希表、有鍵列表,或者關聯數組等,另一種採用有序的值列表,大部分語言把它理解為數組。
常用的創建方式是第一種,即採用「鍵/值對」集合的形式。在這種形式下,一個對象以「{」(左括弧)開始,「}」(右括弧)結束。每個「名稱」後跟一個「:」(冒號),「
『鍵/值' 對」之間使用「,」(逗號)分隔。
JSON具有以下特點:(1)簡單格式化的數據交換;(2)易於人們的讀寫習慣;(3)易於機器的分析和運行。
在JavaScript中,JSON被理解為對象。通過字元串形式的JSON,數據可以很方便地解析成JavaScript獨享,並進行數據的讀取傳遞。通過JSON,在一定程度上客服了JavaScript對象無法作為參數系列化傳遞的問題。
1,簡單的JSON
{name:"劉德華",age:"25",sex:"男"}
2,JSON值的類型
JSON的值可以是簡單的數據類型,例如數字、浮點、字元等,也可以是數組及對象。例如以數組作為member鍵值的JSON:
{member:[{name:"劉德華"},{name:"郭富城"},{name:"張學友"},{name:"黎明"}]}
{
book:[{name:"三國演義"},{name:"西遊記"},{name:"水滸傳"},{name:"紅樓夢"}],
author:[{name:"羅貫中"},{name:"吳承恩"},{name:"施耐安",{name:"曹雪芹"}}]
}
3,在JavaScript中使用JSON
JSON是JavaScript原生格式,這意味著在JavaScript中處理JSON數據不需要任何特殊的API或者工具包,JavaScript默認將JSON當做一個對象處理。
將對象傳遞給一個變數,例如:
復制代碼 代碼如下:
var somebooks = {
book:[{name:"三國演義"},{name:"西遊記"},{name:"水滸傳"},{name:"紅樓夢"}],
author:[{name:"羅貫中"},{name:"吳承恩"},{name:"施耐安",{name:"曹雪芹"}}]
}
JSON的每個「鍵」相當於對象的屬性,例如訪問book中的第一個條目,在JavaScript中,就可以簡單地使用「somebooks.book[0].name」來獲取「三國演義」這個值。
我們不但可以將一個JSON字元串轉化為對象,反過來將一個對象「編譯」為一個JSON字元串,以方便JavaScript中的對象的傳輸。例如:
復制代碼 代碼如下:
var Animals = new Object();
Animals.name = "dog";
Animals.sex = "Male";
Animals.age = "2";
Animals對象無法被序列化傳輸,將Animals對象轉化為JSON字元串,也就是「{name:"dog",sex:"Male",age:"2"}」。這樣,把該JSON字元串作為HTTP請求的一個參數傳遞,從而達到序列化傳輸Animals對象的目的。
(ii)JSON通過字元串形式來表達JavaScript的對象。如:
復制代碼 代碼如下:
var myObject = {nickname:"my girlfried",name:"big
pig"};
JSON
實際上充當了一種在JavaScript對象和字元串之間實現相互轉換的協議。由於JSON的「外表」可以看成但村的字元串,因此JSON在
JavaScript的對象傳輸方面可以起到一定的作用。例如把對象strObject轉換成字元串後進行傳輸,在達到目的地後通過eval方法將其還原
成對象:
復制代碼 代碼如下:
function test (o)
{
alert (o.name)
}
var strObject = '{nickname:"my girlfriend",name:"big pig"}';
test (eval_r("(" + strObject + ")"));
三、自定義對象構造
創建高級對象構造有兩種方式:使用「this」關鍵字構造、使用原型prototype構造。如:
復制代碼 代碼如下:
//使用this關鍵字定義構造的上下文屬性
function Girl()
{
this.name = "big pig";
this.age = 20;
this.standing;
this.bust;
this.waist;
this.hip;
}
//使用prototype
function Girl(){}
Girl.prototype.name = "big pig";
Girl.prototype.age = 20;
Girl.prototype.standing;
Girl.prototype.bust;
Girl.prototype.waist;
Girl.prototype.hip;
alert(new Girl().name);
上例中的兩種定義在本質上沒有區別,都是定義「Girl」對象的屬性信息。「this」與「prototype」的區別主要在於屬性訪問的順序。如:
復制代碼 代碼如下:
function Test()
{
this.text = function()
{
alert("defined by this");
}
}
Test.prototype.test = function()
{
alert("defined by prototype");
}
var _o = new Test();
_o.test();//輸出「defined by this」
當訪問對象的屬性或者方法是,將按照搜索原型鏈prototype
chain的規則進行。首先查找自身的靜態屬性、方法,繼而查找構造上下文的可訪問屬性、方法,最後查找構造的原型鏈。
「this」
與「prototype」定義的另一個不同點是屬性的佔用空間不同。使用「this」關鍵字,示例初始化時為每個實例開辟構造方法所包含的所有屬性、方法
所需的空間,而使用「prototype」定義,由於「prototype」實際上是指向父級的一種引用,僅僅是個數據的副本,因此在初始化及存儲上都比
「this」節約資源。
Ⅲ js可否實現面向對象
JavaScript中對象的創建有以下幾種方式: (一)使用內置對象 (二)使用JSON符號 (三)自定義對象構造 一、使用內置對象 JavaScript可用的內置對象可分為兩種: 一,JavaScript語言原生對象(語言級對象),如String、Object、Function等; 二,JavaScript運行期的宿主對象(環境宿主級對象),如window、document、body等。 我們所說的使用內置對象,是指通過JavaScript語言原生對象的構造方法,實例化出一個新的對象。如: 復制代碼 代碼如下: var str = new String("實例初始化String"); var str一 = "直接賦值的String"; var func = new Function("x","alert(x)");//示例初始化func var o = new Object();//示例初始化一個Object 二、使用JSON符號 (i)何謂JSON ? JSON (JavaScript Object Notation)即JavaScript對象命名,是一種輕量級的數據交換格式,易於閱讀和編寫,同時也易於及其解析和生成。它基於 《JavaScript Programming Language, Standard ECMA-二陸二 三rd Edition - December 一999》的一個子集。JSON是完全獨立於語言的文本格式,因此成為數據交換的理想格式。 JSON作為 JavaScript的一個自己,同時ActionScript、C、C#、ColdFusion、E、Java、JavaScript、ML、 ObjectiveCAML、Perl、PHP、Python、Rebol、Ruby、Lua等一系列的語言都提供支持,使得JSON成為Ajax開發的 首選方案。 JSON有兩種構建方式,一種是採用簡單的「鍵/值對」的集合,在不同的語言中被理解為對象、記錄、結構、字典、哈希表、有鍵列表,或者關聯數組等,另一種採用有序的值列表,大部分語言把它理解為數組。 常用的創建方式是第一種,即採用「鍵/值對」集合的形式。在這種形式下,一個對象以「{」(左括弧)開始,「}」(右括弧)結束。每個「名稱」後跟一個「:」(冒號),「 『鍵/值' 對」之間使用「,」(逗號)分隔。 JSON具有以下特點:(一)簡單格式化的數據交換;(二)易於人們的讀寫習慣;(三)易於機器的分析和運行。 在JavaScript中,JSON被理解為對象。通過字元串形式的JSON,數據可以很方便地解析成JavaScript獨享,並進行數據的讀取傳遞。通過JSON,在一定程度上客服了JavaScript對象無法作為參數系列化傳遞的問題。 一,簡單的JSON {name:"劉德華",age:"二5",sex:"男"} 二,JSON值的類型 JSON的值可以是簡單的數據類型,例如數字、浮點、字元等,也可以是數組及對象。例如以數組作為member鍵值的JSON: {member:[{name:"劉德華"},{name:"郭富城"},{name:"張學友"},{name:"黎明"}]} { book:[{name:"三國演義"},{name:"西遊記"},{name:"水滸傳"},{name:"紅樓夢"}], author:[{name:"羅貫中"},{name:"吳承恩"},{name:"施耐安",{name:"曹雪芹"}}] } 三,在JavaScript中使用JSON JSON是JavaScript原生格式,這意味著在JavaScript中處理JSON數據不需要任何特殊的API或者工具包,JavaScript默認將JSON當做一個對象處理。 將對象傳遞給一個變數,例如: 復制代碼 代碼如下: var somebooks = { book:[{name:"三國演義"},{name:"西遊記"},{name:"水滸傳"},{name:"紅樓夢"}], author:[{name:"羅貫中"},{name:"吳承恩"},{name:"施耐安",{name:"曹雪芹"}}] } JSON的每個「鍵」相當於對象的屬性,例如訪問book中的第一個條目,在JavaScript中,就可以簡單地使用「somebooks.book[0].name」來獲取「三國演義」這個值。 我們不但可以將一個JSON字元串轉化為對象,反過來將一個對象「編譯」為一個JSON字元串,以方便JavaScript中的對象的傳輸。例如: 復制代碼 代碼如下: var Animals = new Object(); Animals.name = "dog"; Animals.sex = "Male"; Animals.age = "二"; Animals對象無法被序列化傳輸,將Animals對象轉化為JSON字元串,也就是「{name:"dog",sex:"Male",age:"二"}」。這樣,把該JSON字元串作為HTTP請求的一個參數傳遞,從而達到序列化傳輸Animals對象的目的。 (ii)JSON通過字元串形式來表達JavaScript的對象。如: 復制代碼 代碼如下: var myObject = {nickname:"my girlfried",name:"big pig"}; JSON 實際上充當了一種在JavaScript對象和字元串之間實現相互轉換的協議。由於JSON的「外表」可以看成但村的字元串,因此JSON在 JavaScript的對象傳輸方面可以起到一定的作用。例如把對象strObject轉換成字元串後進行傳輸,在達到目的地後通過eval方法將其還原 成對象: 復制代碼 代碼如下: function test (o) { alert (o.name) } var strObject = '{nickname:"my girlfriend",name:"big pig"}'; test (eval_r("(" + strObject + ")")); 三、自定義對象構造 創建高級對象構造有兩種方式:使用「this」關鍵字構造、使用原型prototype構造。如: 復制代碼 代碼如下: //使用this關鍵字定義構造的上下文屬性 function Girl() { this.name = "big pig"; this.age = 二0; this.standing; this.bust; this.waist; this.hip; } //使用prototype function Girl(){} Girl.prototype.name = "big pig"; Girl.prototype.age = 二0; Girl.prototype.standing; Girl.prototype.bust; Girl.prototype.waist; Girl.prototype.hip; alert(new Girl().name); 上例中的兩種定義在本質上沒有區別,都是定義「Girl」對象的屬性信息。「this」與「prototype」的區別主要在於屬性訪問的順序。如: 復制代碼 代碼如下: function Test() { this.text = function() { alert("defined by this"); } } Test.prototype.test = function() { alert("defined by prototype"); } var _o = new Test(); _o.test();//輸出「defined by this」 當訪問對象的屬性或者方法是,將按照搜索原型鏈prototype chain的規則進行。首先查找自身的靜態屬性、方法,繼而查找構造上下文的可訪問屬性、方法,最後查找構造的原型鏈。 「this」 與「prototype」定義的另一個不同點是屬性的佔用空間不同。使用「this」關鍵字,示例初始化時為每個實例開辟構造方法所包含的所有屬性、方法 所需的空間,而使用「prototype」定義,由於「prototype」實際上是指向父級的一種引用,僅僅是個數據的副本,因此在初始化及存儲上都比 「this」節約資源
Ⅳ JS 面向對象
為了能夠清楚的解釋這一切,我先從對象講起。從其他面向對象語言(如Java)而來的人可能認為在JS里的對象也是由類來實例化出來的,並且是由屬性和方法組成的。
實際上在JS里並不是如你所想(我開始是這么想的)那樣,對象或直接稱為object,實際上只是一些映射對的集合,像Map,字典等概念。JS里有大概7種類型(加上Symbol),數字、字元串、null、undefined、布爾、Symbol、對象。除對象以外的其他類型屬於原始類型,就是說它們比較單純,包含的東西比較少,基本上就是字面量所表示的那些(像C語言中的一些類型,就是占那麼多空間,沒有其他的東西)。object基本上是一些鍵值對的集合,屬於引用類型,即是有一個名字去指向它來供別人使用的,就好像比較重的東西你拿不動,而只是拿了張記錄東西所在地的紙條。所以當A對象里嵌套了B對象,僅表示A裡面有一個引用指向了B,並不是真正把B包含在A裡面,雖然看起來是這樣(尤其是從對象的字面量上來看),所以才會有所謂的深拷貝與淺拷貝。
有句話叫「JavaScript里一切皆對象」,是因為在很多情況下原始類型會被自動的轉為對象,而函數實際上也是對象,這樣這句話看起來就很有道理了。
說明對象的本質是為了正確地認識對象,因為這關繫到後面的理解。
Ⅳ 用JS用面向對象實現一個JS對象。對象里有兩個屬性,兩個方法,並new一
functionCat(){
this.name="大毛";
this.color="黃色";
this.makeSound=function(){alert('喵');}
this.mainfun=function(){alert('賣萌')}
}
varbigCat=newCat();
Ⅵ js面向對象寫法中 很多人 用到init進行初始化。對此我有幾個問題要問
init只是習慣性寫法,一直以來編程人員的編寫習慣而已。不是必須要這樣寫,不過養回成共同的習慣對答於自己及他人以後對代碼進行修改或者瀏覽會提供方便。
至於為什麼需要初始化,這是大部分對象所需要具有的通用屬性。可能網站小的時候init初始化共用屬性作用不大,但當多次調用該對象時,對象初始化則可能根據調用個體的不同而對本身進行調整。打個比方,「動物」是一個對象函數,作用都是給對象畫上四條腿。把羊、牛、獅子分別賦予「動物」函數時,「動物」函數就需要根據個體的不同進行初始化確定四條腿的粗細了。
建議在編寫對象時按照通用的寫法,畢竟一個對象不是目前可以用到的,以後在其它地方也會用到或者會進行升級擁有更強大的功能,這時候按照通用習慣編寫代碼就顯示出它的優勢了。
Ⅶ 關於javascript的一個問題,js有面向對象性嗎
因為js是弱類型語言.不像c++,C#這類型語言!他不支持函數方法重載.你之前寫一個方法.後面再寫一個相同名字的方法他默認會把上一個方法覆蓋掉!這種情況和PHP中相同!
他不像是C#等語言支持函數重載.根據不同的參數.返回值調用不同的方法!
關於JS是不是面向對象.他不完全是面向對象,他也可以寫成類,方法,屬性.但是和其它的語言稍有不同!比如
var cls={
my:{a:0},
init:function()
{
alert(this.my.a);
}
};
window.onload=function()
{
cls.init();
}
調用cls.init();
這就是他的類,但是缺少了好多面向對象的一些特性.樓上說的很清楚!所以說他不是完全面向對象
面向對象只是一種思路一種解決問題的思路!
Ⅷ js中,什麼是面向對象
js中的面向對象
面向對象在js里有兩個層次的含義,第一種是會使用面向對象函數;第二種是構造面向對象函數。
js也是面向對象中的一種寫法,不過相對於java,js是一種弱數據類型,並不是嚴格意義上的面向對象。但是jq就是使用面向對象的寫法創作出來的js庫。
面向對象的特點
(「抽風機」諧音記憶)
面向對象有四個特點:
1. 抽象:抓住核心問題
2. 封裝:即把能夠實現功能的函數寫成封裝起來,在面向對象里叫做方法。簡單來說就是把實現功能的函數寫成方法。
3. 繼承:繼承的意思是,在實現同一種功能的前提下,新對象可以使用就對象的屬性和方法。
4. 多態:一個變數在引用不同類型的情況下的不同狀態。多態開發在開發組件和模塊化開發的時候能節省很多資源。
舉個例子說明面向對象
// 這里的函數名在面向對象里叫做類function Create(n, s){
// var obj = new Object();
// obj叫做實例,同時也是對象,面向對象寫法中系統會自動創建一個obj空對象
// 對象屬性
this.name = n; this.sex = s; // this指針,在這里指的就是這個對象
// 對象方法
this.showName = function(){
alert(n);
}; this.showSex = function(){
alert(s);
}; // 返回對象
// 同樣,面向對象中系統會自動幫我們返回obj(即this)
//return obj;
//return this;
}
原型(prototype)
原型可以用來構造函數的屬性和方法,使這個構造函數的屬性和方法成為公用的。使用原型的優點:在內存中節省資源,提高系統性能。
下面舉個例子說明原型:
Array.prototype.sum = function(){
var num = 0; for(var i=0;i<this.length;i++){
num += this[i];
}
alert(num);
};1234567
這是一個用原型構造的數組方法,將求和的sum方法掛在原型上,可以使這個方法被重復使用,當然,重點是節省內存資源。
使用原型還有一個優點,就是優先順序:
原型的優先順序類似於CSS中的優先順序,沒有使用原型的構造函數,就好比CSS中的行內樣式,優先順序高,而與原型掛鉤的屬性和方法 ,就像是style的內聯樣式,優先順序低於行內樣式。所以在調用同一種方法名的時候,系統會優先調用掛在原型上的方法!
Ⅸ 用JS用面向對象實現一個JS對象。對象里有兩個屬性,一個方法
function MyObject(){
this.name = "myObject";
this.type = "class";
this.methodA = function(){
alert(this.name);
}
this.methodB = function(){
return this.type;
}
}
var myObject = new MyObject();
myObject.methodA();
var type = myObject.methodB();
alert(type);
Ⅹ 使用js腳本採用面向對象的方法創建一個汽車對象,擁有輪子數目,速度,里程屬性。要求能夠汽車每次前進
構造函數:
function Car(wheelCount,speed){
this.wheelCount=wheelCount;
this.speed =speed;
var distance=0;
this.setDis=function(time){
distance+=speed*time;
};
this.getDis=function(){
return distance;
};
}
var audi=new Car(5,200);
audi.setDis(50);
console.log(audi.getDis());
audi.setDis(100);
console.log(audi.getDis());