Javascript 使用function定義構造函數(shù)
更新時間:2010年02月27日 12:20:37 作者:
Javascript并不像Java、C#等語言那樣支持真正的類。但是在js中可以定義偽類。做到這一點的工具就是構造函數(shù)和原型對象。首先介紹js中的構造函數(shù)。
Javascript中創(chuàng)建對象的語法是在new運算符的后面跟著一個函數(shù)的調用。如
var obj = new Object();
var date = new Date();
運算符new首先創(chuàng)建一個新的沒有任何屬性的對象,然后調用該函數(shù),把新的對象作為this關鍵字的值傳遞。
var date = new Date()的偽代碼的實現(xiàn)就是
var obj = {};
var date = Date.call(obj);
構造函數(shù)的作用就是初始化一個新創(chuàng)建的對象,并在使用對象前設置對象的屬性。如果定義自己的構造函數(shù),只需要編寫一個為this添加屬性的函數(shù)就可以了。下面的代碼定義了一個構造函數(shù):
function Rectangle(w, h)
{
this.width = w;
this.height = h;
}
然后,可以使用new運算符調用這個函數(shù)來創(chuàng)建對象的實例
var rect = new Rectange(4,8);
構造函數(shù)的返回值
Javascript中的構造函數(shù)通常沒有返回值。但是,函數(shù)是允許有返回值的。如果一個構造函數(shù)有一個返回值,則返回的對象成為new表達式的值。在此情況下,作為this的對象將會被拋棄。
使用構造函數(shù)定義法
語法
var object=new objectname();
var -- 聲明對象變量
object -- 對象的名稱
new -- new的關鍵詞(JavaScript關鍵詞)
objectname -- 構造函數(shù)名稱
示例
//定義構造函數(shù)
function Site(url, name)
{
this.url = "www.dbjr.com.cn";
this.name ="夢之都";
}
//使用構造函數(shù)產生一個JavaScript對象的實例
var mysite = new Site();
alert(mysite.url);
構造函數(shù)通??梢猿跏蓟瘜ο笾械囊恍﹥热?,JavaScript內部提供的一些對象通常需要使用構造函數(shù)的方法生成。JavaScript函數(shù)的內容將在下一章介紹。
直接定義法創(chuàng)建JavaScript對象
//定義對象語法
var object={};
//對象內的屬性語法(屬性名(property)與屬性值(value)是成對出現(xiàn)的)
object.property=value;
//對象內的函數(shù)語法(函數(shù)名(func)與函數(shù)內容是成對出現(xiàn)的)
object.func=function(){...;};
var -- 聲明對象變量
object -- 對象的名稱
property -- 對象的屬性名
func -- 對象的方法名
說明:對象可以包含一些屬性(函數(shù)可以看作帶有括號的特殊屬性),每個屬性有名稱和值。名稱可以是任何字符串甚至是空。值可以是任何javascript類型,但不能是undefined。
使用定義法定義的對象示例
var site = {};
site.URL = "www.dbjr.com.cn";
site.name = "腳本之家";
site.englishname = "jb51";
site.author = "腳本";
site.summary = "免費的網頁設計教程";
site.pagescount = 100;
site.isOK = true;
site.startdate = new Date(2005, 12);
site.say = function(){alert(this.englishname+" say : hello world!")};
site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已經"+theage+"歲了!")}
使用構造函數(shù)創(chuàng)建JavaScript對象示例 -- 可以嘗試編輯
使用構造函數(shù)創(chuàng)建JavaScript對象
上面的方法定義了一個site的對象,并且為其定義了七個屬性,與兩個個方法。
say方法會打印出jb51 say : hello world!的字符串
age方法會計算出夢之都網站的年齡
猴子提示: 注意每個屬性與函數(shù)前面都要加上對象的名稱,否則JavaScript無法判斷它是屬于那個對象的。
下面的課程將講解直接定義法的延伸,JSON定義法。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
復制代碼 代碼如下:
var obj = new Object();
var date = new Date();
運算符new首先創(chuàng)建一個新的沒有任何屬性的對象,然后調用該函數(shù),把新的對象作為this關鍵字的值傳遞。
復制代碼 代碼如下:
var date = new Date()的偽代碼的實現(xiàn)就是
var obj = {};
var date = Date.call(obj);
構造函數(shù)的作用就是初始化一個新創(chuàng)建的對象,并在使用對象前設置對象的屬性。如果定義自己的構造函數(shù),只需要編寫一個為this添加屬性的函數(shù)就可以了。下面的代碼定義了一個構造函數(shù):
復制代碼 代碼如下:
function Rectangle(w, h)
{
this.width = w;
this.height = h;
}
然后,可以使用new運算符調用這個函數(shù)來創(chuàng)建對象的實例
復制代碼 代碼如下:
var rect = new Rectange(4,8);
構造函數(shù)的返回值
Javascript中的構造函數(shù)通常沒有返回值。但是,函數(shù)是允許有返回值的。如果一個構造函數(shù)有一個返回值,則返回的對象成為new表達式的值。在此情況下,作為this的對象將會被拋棄。
使用構造函數(shù)定義法
語法
復制代碼 代碼如下:
var object=new objectname();
var -- 聲明對象變量
object -- 對象的名稱
new -- new的關鍵詞(JavaScript關鍵詞)
objectname -- 構造函數(shù)名稱
示例
復制代碼 代碼如下:
//定義構造函數(shù)
function Site(url, name)
{
this.url = "www.dbjr.com.cn";
this.name ="夢之都";
}
//使用構造函數(shù)產生一個JavaScript對象的實例
var mysite = new Site();
alert(mysite.url);
構造函數(shù)通??梢猿跏蓟瘜ο笾械囊恍﹥热?,JavaScript內部提供的一些對象通常需要使用構造函數(shù)的方法生成。JavaScript函數(shù)的內容將在下一章介紹。
直接定義法創(chuàng)建JavaScript對象
復制代碼 代碼如下:
//定義對象語法
var object={};
//對象內的屬性語法(屬性名(property)與屬性值(value)是成對出現(xiàn)的)
object.property=value;
//對象內的函數(shù)語法(函數(shù)名(func)與函數(shù)內容是成對出現(xiàn)的)
object.func=function(){...;};
var -- 聲明對象變量
object -- 對象的名稱
property -- 對象的屬性名
func -- 對象的方法名
說明:對象可以包含一些屬性(函數(shù)可以看作帶有括號的特殊屬性),每個屬性有名稱和值。名稱可以是任何字符串甚至是空。值可以是任何javascript類型,但不能是undefined。
使用定義法定義的對象示例
復制代碼 代碼如下:
var site = {};
site.URL = "www.dbjr.com.cn";
site.name = "腳本之家";
site.englishname = "jb51";
site.author = "腳本";
site.summary = "免費的網頁設計教程";
site.pagescount = 100;
site.isOK = true;
site.startdate = new Date(2005, 12);
site.say = function(){alert(this.englishname+" say : hello world!")};
site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已經"+theage+"歲了!")}
使用構造函數(shù)創(chuàng)建JavaScript對象示例 -- 可以嘗試編輯
使用構造函數(shù)創(chuàng)建JavaScript對象
上面的方法定義了一個site的對象,并且為其定義了七個屬性,與兩個個方法。
say方法會打印出jb51 say : hello world!的字符串
age方法會計算出夢之都網站的年齡
猴子提示: 注意每個屬性與函數(shù)前面都要加上對象的名稱,否則JavaScript無法判斷它是屬于那個對象的。
下面的課程將講解直接定義法的延伸,JSON定義法。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關文章
HTML+CSS+JavaScript實現(xiàn)下拉菜單效果
這篇文章主要為大家詳細介紹了HTML+CSS+JavaScript實現(xiàn)下拉菜單效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-07-07老生常談document.ready和window.onload
這篇文章主要介紹了document.ready和window.onload的相關知識,包括document.ready和window.onload的區(qū)別,要使用document.ready()或者document.onload()的原因分析,本文結合實例代碼給大家介紹的非常詳細,需要的朋友參考下吧2024-01-01JavaScript實現(xiàn)簡單的隱藏式側邊欄功能示例
這篇文章主要介紹了JavaScript實現(xiàn)簡單的隱藏式側邊欄功能,涉及javascript結合定時器針對頁面元素屬性動態(tài)操作相關實現(xiàn)技巧,需要的朋友可以參考下2018-08-08