JavaScript 開發經驗整理

時間 2019-12-04

原文原文鏈接

　　前言今年接觸了一個B/S的項目，總結了一些JavaScript開發經驗，整理些有用的內容與你們分享。本文會持續更新...javascript

一、實現代碼訪問的控制java

　　隨着項目JavaScript代碼庫擴大，本應被控制在私有做用域的函數與變量將會暴漏的愈來愈多，這時你的全局做用域被「污染」的可能性就會愈來愈大。這不只會致使命名衝突，也會爲BUG提供溫牀。所以，咱們須要編寫自包含的、不透明的JavaScript代碼，它不會向外界暴漏內部的細節，也不會與現有的框架與腳本庫發生衝突。事實上這正是大規模編程的主要要求web

　示例以下：編程

//定義一個obj的對象
    var obj = (function () {

        var privateField = 42;
        var publicField = 'foobar';

        //obj對象 私有方法
        function processInternals() {
            alert('私有的：' + privateField);
        }
        //obj對象 私有方法
        function run() {
            processInternals();
            alert('私有的：' + privateField);
            alert('公共的：' + publicField);
        }
      
        return {
            publicField: publicField, //返回名稱爲publicField 私有變量
            run: run  //返回名稱爲run私有方法
        };
    })();//注意此處增長();

    obj.run();//調用obj對象run()方法
    obj.publicField;// 調用obj對象public屬性

    obj.processInternals();//訪問私有方法，爲NULL
    obj.privateField;//訪問私有屬性，爲NULL

二、動態加載Javascript文件性能優化

　　傳統的<script>標籤加載js文件很方便只需加入網頁便可，可是存在嚴重的缺陷。app

　　一、嚴格的讀取順序；二、性能問題，多個js文件同步加載頁面會堵塞，頁面相應緩慢；框架

　　爲了解決以上問題可使用DOM方法，動態加載javascript文件。注：DOM動態加載的js文件，其中事件和相關綁定也會自動綁定；dom

　示例以下：函數

        function loadScript(url) {
            var script = document.createElement("script");//獲取script dom對象
            script.type = "text/javascript";//聲明類型
            script.src = url;
            document.body.appendChild(script);//動態加載js文件
        }

三、AJAX性能

四、Javascript 調試技巧

五、DOM

六、web性能優化

七、WebSocket

八、HTTP和HTTPS

九、...