理解Javascript_03_javascript全局觀

作者: 笨蛋的座右銘來源: 博客園發布時間: 2010-10-18 21:31 閱讀: 1024 次推薦: 0 原文鏈接 [收藏]

　　今天讓我們站在語言的高度來看一下Javascript都有點什么。因為是全局性的俯瞰，所以不針對細節作詳細的講解。

　　先來看一張圖吧：

　　解釋一下：

　　核心（ECMAScript)：定義了腳本語言的所有對象，屬性和方法。文檔對象模型（DOM)：HTML和XML應用程序接口。瀏覽器對象模型(BOM)：對瀏覽器窗口進行訪問操作

　　現在來具體的講一個各個成分：

　　關于ECMAScript

　　ECMAScript的工作是定義語法和對象，從最基本的數據類型、條件語句、關鍵字、保留字到異常處理和對象定義都是它的范疇。在ECMAScript范疇內定義的對象也叫做原生對象。其實上它就是一套定義了語法規則的接口，然后由不同的瀏覽器對其進行實現,最后我們輸寫遵守語法規則的程序，完成應用開發需求。

　　關于DOM

　　根據DOM的定義(HTML和XML應用程序接口)可知DOM由兩個部分組成，針對于XML的DOM即DOM Core和針對HTML的DOM HTML。那DOM Core 和DOM HTML有什么區別與聯系呢？DOM Core的核心概念就是節點(Node)。DOM會將文檔中不同類型的元素(這里不元素并不特指<div>這種tag,還包括屬性，注釋，文本之類）都看作為不同的節點。

　　上圖描述了DOM CORE的結構圖，比較專業,來看一個簡單的：

<div id="container">
  	<span>hello world</span>
  </div>

　　來看一下這段代碼在標準瀏覽器里的DOM表現:

　　div和span元素被展現成了一個元素節點，對應到節點結構圖中的Element元素。"hello world"和div與span之間的間隔，被展現成了文本節點，對應到節點結構圖中的CharacterDate元素。DOM CORE在解析文檔時，會將所有的元素、屬性、文本、注釋等等視為一個節點對象（或繼承自節點對象的對象,多態、向上轉型）,根據文本結構依次展現，最后行成了一棵"DOM樹"。

　　DOM HTML的核心概念是HTMLElement，DOM HTML會將文檔中的元素（這里的元素特指<body>這種tag,不包括注釋，屬性，文本)都視為HTMLElement。而元素的屬性，則為HTMLElement的屬性。

　　再來看一個示例：

　　從Node接口提供的屬性，myElement.attributes["id"].value;很明顯myElement.attributes["id"]返回一個對象.value是得到對象的value屬性。Element實現的方法返回 myElement.getAttributes("id");很明顯此時id現在只是一個屬性而已，這只是一個得到屬性的操作。

　　其實上DOM Core和DOM html的外部調用接口相差并不是很大，對于html文檔可以用DOM html進行操作，針對xhtml可以用DOM Core。

　　關于BOM

　　老規則，先來一張圖：

　　 BOM與瀏覽器緊密結合,這些對象也被稱為是宿主對象，即由環境提供的對象。這里要強調一個奇怪的對象Global對象，它代表一個全局對象，Javascript是不允許存在獨立的函數，變量和常量，如果沒有額外的定義，他們都作為Global對象的屬性或方法來看待.像parseInt(),isNaN(),isFinite()等等都作為Global對象的方法來看待，像Nan,Infinity等"常量"也是Global對象的屬性。像Boolean,String,Number，RegExp等內置的全局對象的構造函數也是Global對象的屬性.但是Global對象實際上并不存在，也就是說你用Global.NaN訪問NaN將會報錯。實際上它是由window來充當這個角色，并且這個過程是在javascript首次加載時進行的。

　　好了，好了，就到這吧，本來還有一部分，算了，以后另開一節再說吧。