===運算符判斷等的規則javascript有哪些方法定義對象評價一下三種方法實現繼承的優缺點,并改進應用程序存儲和離線web應用js有多種存儲方案,像cookie,userData,Flash,LocalStorage,sessionStorage,globalStorage等,僅IE支持userData,globalStorage是Firefox獨有的,而隨著HTML5的出現,flash也逐漸退出這個舞臺,因此現在的主角只有三個:cookie、LocalStorage、SessionStorage。三者都保存在瀏覽器端,都有大小限制和同源限制。 它們三個最為明顯的區別就是cookie的容量只有4KB,所有瀏覽器都支持cookie,而另外兩個的容量相對來說大很多,通常為5M。 第二點是,cookie會在請求時發送至服務器,作為請求標識,服務器可以修改coolie,而LocalStorage和SessionStorage不會。 第三點就是,因為別人可以分析存儲在存放在本地的cookie,進行cookie欺騙,所以相對于另外兩種,cookie不是很安全。 所以通常會將登陸信息等重要信息保存在session中,其他信息如果需要保留,則保存在cookie中。 然后是,對于LocalStorage和SessionStorage,兩者的區別是SessionStorage是會話式的緩存,關閉頁面后數據就會被清除。而LocalStorage是持久性的緩存,除非手動清除,不然數據永遠有效,永遠都不會被清除。
獲取元素的屬性通常有兩種方式,第一種是取得這個元素后,通過element.getAttribute()方法,把要獲取的屬性名稱傳入作為參數,第二種是element.propertyName,得到元素的相應特性值,也就是property,大多數情況下元素的property和attribute的值是一樣的,但是畢竟也有一些例外,對于沒有對應特性的屬性,只能用getAttribute方法。我個人更傾向于用getAttribute()方法,原因有三:一是起碼不用刻意去記哪些元素的哪些屬性可以用element.propertyName。第二,setAttribute的優勢在于他可以修改文檔中任意元素的任意屬性。最后一點就是,可移植行更好,因為DOM是一種適用于多種環境和多種程序設計語言的通用型API,而element.propertyName只能適用于web文檔。
readyState:表示請求狀態的整數,取值: UNSENT(0):對象已創建OPENED(1):open()成功調用,在這個狀態下,可以為xhr設置請求頭,或者使用send()發送請求HEADERS_RECEIVED(2):所有重定向已經自動完成訪問,并且最終響應的HTTP頭已經收到LOADING(3):響應體正在接收DONE(4):數據傳輸完成或者傳輸產生錯誤onreadystatechange:readyState改變時調用的函數status:服務器返回的HTTP狀態碼(如,200, 404) statusText:服務器返回的HTTP狀態信息(如,OK,No Content)responseText:作為字符串形式的來自服務器的完整響應responseXML: Document對象,表示服務器的響應解析成的XML文檔abort():取消異步HTTP請求getAllResponseHeaders(): 返回一個字符串,包含響應中服務器發送的全部HTTP報頭。每個報頭都是一個用冒號分隔開的名/值對,并且使用一個回車/換行來分隔報頭行getResponseHeader(headerName):返回headName對應的報頭值open(method, url, asynchronous [, user, passWord]):初始化準備發送到服務器上的請求。method是HTTP方法,不區分大小寫;url是請求發送的相對或絕對URL;asynchronous表示請求是否異步;user和password提供身份驗證setRequestHeader(name, value):設置HTTP報頭send(body):對服務器請求進行初始化。參數body包含請求的主體部分,對于POST請求為鍵值對字符串;對于GET請求,為null===運算符判斷等的規則var obj = {};構造函數: var obj = new Object();Object.create(): `var obj = Object.create(Object.prototype);方法1:
優點:正確設置原型鏈實現繼承優點:父類實例屬性得到繼承,原型鏈查找效率提高,也能為一些屬性提供合理的默認值缺點:父類實例屬性為引用類型時,不恰當地修改會導致所有子類被修改缺點:創建父類實例作為子類原型時,可能無法確定構造函數需要的合理參數,這樣提供的參數繼承給子類沒有實際意義,當子類需要這些參數時應該在構造函數中進行初始化和設置總結:繼承應該是繼承方法而不是屬性,為子類設置父類實例屬性應該是通過在子類構造函數中調用父類構造函數進行初始化方法2:
優點:正確設置原型鏈實現繼承缺點:父類構造函數原型與子類相同。修改子類原型添加方法會修改父類方法3:
優點:正確設置原型鏈且避免方法1.2中的缺點缺點:ES5方法需要注意兼容性改進:
所有三種方法應該在子類構造函數中調用父類構造函數實現實例屬性初始化function Rect() { Shape.call(this);}用新創建的對象替代子類默認原型,設置Rect.prototype.constructor = Rect;保證一致性第三種方法的polyfill:function create(obj) { if (Object.create) { return Object.create(obj); } function f() {}; f.prototype = obj; return new f();}HTML5新增應用程序緩存,允許web應用將應用程序自身保存到用戶瀏覽器中,用戶離線狀態也能訪問。 1.為html元素設置manifest屬性:<html manifest="myapp.appcache">,其中后綴名只是一個約定,真正識別方式是通過text/cache-manifest作為MIME類型。所以需要配置服務器保證設置正確 2.manifest文件首行為CACHE MANIFEST,其余就是要緩存的URL列表,每個一行,相對路徑都相對于manifest文件的url。注釋以#開頭 3.url分為三種類型:CACHE:為默認類型。NETWORK:表示資源從不緩存。 FALLBACK:每行包含兩個url,第二個URL是指需要加載和存儲在緩存中的資源, 第一個URL是一個前綴。任何匹配該前綴的URL都不會緩存,如果從網絡中載入這樣的URL失敗的話,就會用第二個URL指定的緩存資源來替代。以下是一個文件例子:
雅虎Best Practices for Speeding Up Your Web Site:
content方面
減少HTTP請求:合并文件、CSS精靈、inline Image減少DNS查詢:DNS查詢完成之前瀏覽器不能從這個主機下載任何任何文件。方法:DNS緩存、將資源分布到恰當數量的主機名,平衡并行下載和DNS查詢避免重定向:多余的中間訪問使Ajax可緩存非必須組件延遲加載未來所需組件預加載減少DOM元素數量將資源放到不同的域下:瀏覽器同時從一個域下載資源的數目有限,增加域可以提高并行下載量減少iframe數量不要404Server方面
使用CDN添加Expires或者Cache-Control響應頭對組件使用Gzip壓縮配置ETagFlush Buffer EarlyAjax使用GET進行請求避免空src的img標簽Cookie方面 減小cookie大小引入資源的域名不要包含cookiecss方面 將樣式表放到頁面頂部不使用CSS表達式使用不使用@import不使用IE的FilterJavascript方面 將腳本放到頁面底部將javascript和css從外部引入壓縮javascript和css刪除不需要的腳本減少DOM訪問合理設計事件監聽器圖片方面 優化圖片:根據實際顏色需要選擇色深、壓縮優化css精靈不要在HTML中拉伸圖片保證favicon.ico小并且可緩存移動方面 保證組件小于25kPack Components into a Multipart Document新聞熱點
疑難解答