• <ruby id="5koa6"></ruby>
    <ruby id="5koa6"><option id="5koa6"><thead id="5koa6"></thead></option></ruby>

    <progress id="5koa6"></progress>

  • <strong id="5koa6"></strong>
  • JavaScript教程--從入門到精通(4)

    發表于:2007-06-21來源:作者:點擊數: 標簽:
    基于對象的 Java Script語言 JavaScript語言是基于對象的(Object-Based),而不是 面向對象 的(object-oriented)。之所以說它是一門基于對象的語言,主要是因為它沒有提供象抽象、繼承、重載等有關面向對象語言的許多功能。而是把其它語言所創建的復雜對

       

    基于對象的JavaScript語言


      JavaScript語言是基于對象的(Object-Based),而不是面向對象的(object-oriented)。之所以說它是一門基于對象的語言,主要是因為它沒有提供象抽象、繼承、重載等有關面向對象語言的許多功能。而是把其它語言所創建的復雜對象統一起來,從而形成一個非常強大的對象系統。


        雖然JavaScript語言是一門基于對象的,但它還是具有一些面向對象的基本特征。它可以根據需要創建自己的對象,從而進一步擴大JavaScript的應用范圍,增強編寫功能強大的Web文檔。


    一、對象的基礎知識
    1、對象的基本結構
      JavaScript中的對象是由屬性(properties)和方法(methods)兩個基本的元素的構成的。前者是對象在實施其所需要行為的過程中,實現信息的裝載單位,從而與變量相關聯;后者是指對象能夠按照設計者的意圖而被執行,從而與特定的函數相聯。


    2、引用對象的途徑
      一個對象要真正地被使用,可采用以下幾種方式獲得:
      o 引用JavaScript內部對象;
      o 由瀏覽器環境中提供;
      o 創建新對象。
      這就是說一個對象在被引用之前,這個對象必須存在,否則引用將毫無意義,而出現錯誤信息。從上面中我們可以看出JavaScript引用對象可通過三種方式獲取。要么創建新的對象,要么利用現存的對象。


    3、有關對象操作語句
      JavaScript不是一純面向對象的語言,它設有提供面向對象語言的許多功能,因此JavaScript設計者之所以把它你“基于對象”而不是面向對象的語言,在JavaScript中提供了幾個用于操作對象的語句和關鍵字及運算符。
    (1) For...in語句
    格式如下:
    For(對象屬性名 in 已知對象名)
    說明:
    o 該語句的功能是用于對已知對象的所有屬性進行操作的控制循環。它是將一個已知對象的所有屬性反復置給一個變量;而不是使用計數器來實現的。
    o 該語句的優點就是無需知道對象中屬性的個數即可進行操作。
    例:下列函數是顯示數組中的內容:
    Function showData(object)
    for (var X=0; X<30;X++)
    document.write(object[i]);

    該函數是通過數組下標順序值,來訪問每個對象的屬性,使用這種方式首先必須知道數組的下標值,否則若超出范圍,則就會發生錯誤。而使For...in語句,則根本不需要知道對象屬性的個數,見下:
    Function showData(object)
    for(var prop in object)
    document.write(object[prop]);

    使用該函數時,在循環體中,For自動將的屬性取出來,直到最后為此。
    (2) with語句
    使用該語句的意思是:在該語句體內,任何對變量的引用被認為是這個對象的屬性,以節省一些代碼。
    with object{
    ...}
    所有在with語句后的花括號中的語句,都是在后面object對象的作用域的。
    (3) this關鍵字
    this是對當前的引用,在JavaScript由于對象的引用是多層次,多方位的,往往一個對象的引用又需要對另一個對象的引用,而另一個對象有可能又要引用另一個對象,這樣有可能造成混亂,最后自己已不知道現在引用的那一個對象,為此JavaScript提供了一個用于將對象指定當前對象的語句this。
    (4) New運算符
    雖然在JavaScript中對象的功能已經是非常強大的了。但更強大的是設計人員可以按照需求來創建自己的對象,以滿足某一特定的要求。使用New運算符可以創建一個新的對象。其創建對象使用如下格式:
    Newobject=NEW Object(Parameters table);
    其中Newobject創建的新對象:object是已經存在的對象; parameters table參數表;new是JavaScript中的命令語句。
    如創建一個日期新對象
    newData=New Data()
    birthday=New Data (December 12.1998)
    之后就可使NewData、birthday作為一個新的日期對象了。
     
    4、對象屬性的引用
      對象屬性的引用可由下列三種方式之一實現:
    (1)使用點(.)運算符
    university.Name=“云南省”
    university.city=“昆明市”
    university.Date="1999"

    其中university是一個已經存在的對象,Name、City、Date是它的三個屬性,并通過操作對其賦值。
    (2)通過對象的下標實現引用
    university[0]=“云南”
    university[1]=“昆明市”
    university[2]="1999"

    通過數組形式的訪問屬性,可以使用循環操作獲取其值。
    function showunievsity(object)
    for (var j=0;j<2; j++)
    document.write(object[j])

    若采用For...in則可以不知其屬性的個數后就可以實現:
    Function showmy(object)
    for (var prop in this)
    docament.write(this[prop]);

    (3)通過字符串的形式實現
    university["Name"]=“云南”
    university["City"]=“昆明市”
    university["Date"]="1999"


    5、對象的方法的引用
    在JavaScript中對象方法的引用是非常簡單的。
    ObjectName.methods()
    實際上methods()=FunctionName方法實質上是一個函數。 如引用university對象中的showmy()方法,則可使用:
    document.write (university.showmy())
    或:document.write(university)
    如引用math內部對象中cos()的方法
    則:
    with(math)
    document.write(cos(35));
    document.write(cos(80));
    若不使用with則引用時相對要復雜些:
    document.write(Math.cos(35))
    document.write(math.sin(80))

    二、常用對象的屬性和方法
      JavaScript為我們提供了一些非常有用的常用內部對象和方法。用戶不需要用腳本來實現這些功能。這正是基于對象編程的真正目的。
      在JavaScript提供了string(字符串)、math(數值計算)和Date(日期)三種對象和其它一些相關的方法。從而為編程人員快速開發強大的腳本程序提供了非常有利的條件。

    1、常用內部對象
      在JavaScript中對于對象屬性與方法的引用,有兩種情況:其一是說該對象是靜態對象,即在引用該對象的屬性或方法時不需要為它創建實例;而另一種對象則在引用它的對象或方法是必須為它創建一個實例,即該對象是動態對象。
      對JavaScript內部對象的引用,以是緊緊圍繞著它的屬性與方法進行的。因而明確對象的靜動性對于掌握和理解JavaScript內部對象是具有非常重要的意義。



    1)、串對象
      o string對象:內部靜態性。
      o 訪問properties和methods時,可使用(.)運算符實現。
      o 基本使用格式:objectName.prop/methods
    (1)串對象的屬性
      該對象只有一個屬性,即length。它表明了字符串中的字符個數,包括所有符號。
    例:
    mytest="This is a JavaScript"
    mystringlength=mytest.length
      最后mystringlength返回mytest字串的長度為20。
    (2)串對象的方法
      string對象的方法共有19個。主要用于有關字符串在Web頁面中的顯示、字體大小、字體顏色、字符的搜索以及字符的大小寫轉換。
    其主要方法如下:
      o 錨點anchor():該方法創建如用Html文檔中一樣的anchor標記。使用anchor如用Html中(A Name="")一樣。通過下列格式訪問:string.anchor(anchorName)。
      o 有關字符顯示的控制方法
    big字體顯示, Italics()斜體字顯示,bold()粗體字顯示,blink()字符閃爍顯示,small()字符用小體字顯示,fixed()固定高亮字顯示、fontsize(size)控制字體大小等。
      o 字體顏色方法;fontcolor(color)
      o 字符串大小寫轉換
    toLowerCase()-小寫轉換,toUpperCase()大寫轉換。下列把一個給定的串分別轉換成大寫和小寫格式:
    string=stringValue.toUpperCase和string=stringValue.toLowerCase。
      o 字符搜索:indexOf[charactor,fromIndex]
    從指定formIndtx位置開始搜索charactor第一次出現的位置。
    返回字串的一部分字串:substring(start,end)
    從start開始到end的字符全部返回。
     
    2)、算術函數的math對象
     功能:提供除加、減、乘、除以外的一引些自述運算。如對數,平方根等 。
     靜動性:靜態對象
    (1)主要屬性
      math中提供了6個屬性,它們是數學中經常用到的常數E、以10為底的自然對數LN10、以2為底的自然對數LN2、3.14159的PI、1/2的平方根SQRT1-2,2的平方根為SQRT2。
    (2)主要方法
     絕對值:abs()
     正弦余弦值:sin(),cos()
     反正弦反余弦 :asin(), acos()
     正切反正切:tan(),atan()
     四舍五入:round()
     平方根:sqrt()
     基于幾方次的值:Pow(base,exponent)
    ...
    3)、日期及時間對象
     功能:提供一個有關日期和時間的對象。
     靜動性:動態性,即必須使用New運算符創建一個實例。例:
    MyDate=New Date()
    Date對象沒有提供直接訪問的屬性。只具有獲取和設置日期和時間的方法。
     日期起始值:1770年1月1日00:00:00。
    1. 獲取日期的時間方法
     getYear(): 返回年數
     getMonth():返回當月號數
     getDate(): 返回當日號數
     getDay():返回星期幾
     getHours():返回小時數
     getMintes(:返回分鐘數
     getSeconds():返回秒數
     getTime() : 返回毫秒數
    (2)設置日期和時間:
     setYear();設置年
     setDate():設置當月號數
     setMonth():設置當月份數
     setHours():設置小時數
     setMintes():設置分鐘數
     setSeconds():設置秒數
     setTime ():設置毫秒數
    ...
    2、JavaScript中的系統函數
      JavaScript中的系統函數又稱內部方法。它提供了與任何對象無關的系統函數,使用這些函數不需創建任何實例,可直接用。
    1.返回字符串表達式中的值:
     方法名:eval(字串表達式),例:
    test=eval("8+9+5/2");
    2. 返回字符串ASCI碼:
     方法名:unEscape (string)
    3.返回字符的編碼:
     方法名:escape(character)
    4.返回實數:
    parseFloat(floustring);
    5.返回不同進制的數:
    parseInt(numbestring ,rad.X)
    其中radix是數的進制,numbs字符串數


    三、范例
    下面是一個時鐘顯示的JavaScript文檔。在文檔中用了非常多的函數。
    Test4_1.htm
    <html>
    <head>
    <style TYPE="text/css">
    <style>
    </style>
    <title>時鐘</title>
    <script LANGUAGE="JavaScript">
    function showClock() {
    }
    function hideClock() {
    }
    var timerID = null
    var timerRunning = false
    function stopClock() {
    if(timerRunning)
    clearTimeout(timerID);
    timerRunning = false
    document.clock.face.value = "";
    }
    function showTime() {
    var now = new Date();
    var year = now.getYear();
    var month = now.getMonth() + 1;
    var date = now.getDate();
    var hours = now.getHours();
    var mins = now.getMinutes();
    var secs = now.getSeconds();
    var timeVal = "";
    timeVal += ((hours <= 12) ? hours : hours - 12);
    timeVal += ((mins < 10) ? ":0" : ":") + mins;
    timeVal += ((secs <= 10) ? ":0" : ":") + secs;
    timeVal += ((hours < 12) ? "AM" : "PM");
    timeVal += ((month < 10) ? " on 0" : " on ") + month + "-";
    timeVal += date + "-" + year;
    document.clock.face.value = timeVal;
    timerID = setTimeout("showTime()", 1000);
    timerRunning = true
    }
    function startClock() {
    stopClock();
    showTime();
    }
     
    function windowOpener( indexnum ){
    var loadpos="date.html"+"#"+indexnum;
    controlWindow=window.open(loadpos,"date","toolbar=no,location=no,
    directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,
    width=620,height=400");
    }
    </script>
    </head>
    <body onLoad="startClock()" >
    <p align="center"><big><span style="background-color: rgb(45,45,45)">
    <font face="Arial">form</font> &nbsp; <font face="宋體">時鐘</font>
    </span></big></p>
    <p align="center"> </p>
    <div align="center"><center>
    <table border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td width="100%"><form NAME="clock" onSubmit="0">
    <div align="center"><center><p><input TYPE="text" NAME="face" size="20"
    VALUE style="background-color: rgb(192,192,192)"> </p>
    </center></div>
    </form>
    </td>
    </tr>
    </table>
    </center></div>
    </body>
    </html>

      本講介紹了基于對象的JavaScript中常用內部對象屬性、方法的使用。

    原文轉自:http://www.kjueaiud.com

    老湿亚洲永久精品ww47香蕉图片_日韩欧美中文字幕北美法律_国产AV永久无码天堂影院_久久婷婷综合色丁香五月

  • <ruby id="5koa6"></ruby>
    <ruby id="5koa6"><option id="5koa6"><thead id="5koa6"></thead></option></ruby>

    <progress id="5koa6"></progress>

  • <strong id="5koa6"></strong>