學過前端開發的地球人應該都瞭解，JavaScript分為三個部分：ECMAScript(JS語言本身基礎語法)，DOM(文檔對象模型，應用程式編程介面)，BOM(瀏覽器對象模型)。 BOM，實際上與瀏覽器有關係。因此瀏覽器廠商可以按照各自的想法隨意去擴展(基於window對象的擴展)。不過，擴展歸擴 ...
學過前端開發的地球人應該都瞭解，JavaScript分為三個部分：ECMAScript(JS語言本身基礎語法)，DOM(文檔對象模型，應用程式編程介面)，BOM(瀏覽器對象模型)。
BOM，實際上與瀏覽器有關係。因此瀏覽器廠商可以按照各自的想法隨意去擴展(基於window對象的擴展)。不過，擴展歸擴展，每個瀏覽器之間都遵循著一套標準。學習BOM對於理解JS這門語言仍然是很重要的，因此不能忽視。以下是我的一些總結，給出一些常用方法。並不會細說每個方法如何使用，這篇文章的主要目的，就是希望BOM在我們腦子裡形成一個簡單的框架。知道一些常用的方法，在遇到問題的時候可以追本溯源。
BOM中存在五個對象：
- window對象(核心對象)
- location對象(即是window對象的屬性，又是document對象的屬性)
- navigator對象
- history對象：至今未使用過
- screen對象：至今未使用過
每個對象下都存在一些屬性和方法，下麵列出幾種常見和常使用的方法，同時給出簡單的說明。
- window對象(核心對象)的常見方法
- 非同步：XMLHttpRequest構造函數
- Number數據類型：Number, parseInt, parseFloat, isNaN, isFinite
- 定時器：setTimeout, setInterval。這裡想說明一下的是，setTimeout中回調函數中的this會指向window對象，原因其實很簡單。在回調函數作為參數傳遞給了setTimout, 此時發生this的隱式賦值丟失。還有一個需要註意的是setTimeout的執行順序問題。
- url加密：encodeURI, encodeURIComponent方法
- url解密：decodeURI, decodeURIComponent方法
- 視窗尺寸：(innerWidth, innerHeight) (outerWidth, outerHeight)，這裡要與DOM中的client dimension和offset dimension區分開來，也就是clientWidth(Height) 和 offsetWidth(Height)
- 視窗位置：(screenLeft, screenRight) (screenX, screenY)
- 打開新視窗: open方法，此方法可接收三個參數
- 系統對話框：alert, confirm, prompt方法
- location對象
- href屬性：獲取url地址, (也可以通過此屬性設置url地址)
- protocal屬性：返回頁面使用的協議, (也可以通過此屬性設置protocal)
- host屬性：返回伺服器名稱和埠號，既包括hostname + port. (也可以通過此屬性設置host)
- hostname屬性：返回不帶埠號的伺服器名稱, (也可以通過此屬性設置hostname)
- port屬性：返回埠號, (也可以通過此屬性設置port)
- pathname屬性：返回url目錄或文件名, (也可以通過此屬性設置pathname)
- hash屬性：返回url中的hash(#content), (也可以通過此屬性設置hash)
- search屬性：query string(如?name=keith&height=180), (也可以通過此屬性設置search)
- reload方法：頁面以最有效的方式載入。也就是說，如果頁面自上次請求以來並沒有改變過，頁面就會從瀏覽器緩存中載入。如果要強制從瀏覽器重新載入，可以傳遞一個true的布爾值。
- navigator對象
- userAgent：用戶代理，查詢用戶使用的瀏覽器信息。在移動端上可用於判斷用戶使用的是哪種類型的移動設備或瀏覽器
