前端javascript知識（二）
阿新 • • 發佈：2017-11-17
如何實現 end spl 人員 每次 很多 params getprop ram
- documen.write和 innerHTML的區別
document.write只能重繪整個頁面 innerHTML可以重繪頁面的一部分 - 瀏覽器檢測通過什麽？
（1） navigator.userAgent （2） 不同瀏覽器的特性，如addEventListener - JavaScript有哪幾種數據類型？
簡單，Number，Boolean，String，Null，Undefined 復合，Object，Array，Function - 截取字符串“abcdefghi”的“fghi”
-寫出下面的運算結果var myvalue=”abcdefghi”; var jiequ=myvalue.substring(myvalue.length-4,myvalue.length); alert(jiequ);alert(typeof(null)); // object alert(typeof(undefined)); // undefined alert(typeof(NaN)); // number alert(NaN==undefined); // false alert(NaN==NaN); // false var str="123abc"; alert(typeof(str++)); // number alert(str);// NaN - 問執行完畢後 x, y, z 的值分別是多少？
var x = 1, y = z = 0; function add(n) { n = n+1; } y = add(x); function add(n) { n = n + 3; } z = add(x); 1、undefined、undefined - 如何阻止事件的冒泡?
//阻止冒泡的方法 function stopPP(e) { var evt = e|| window.event; //IE用cancelBubble=true來阻止而FF下需要用stopPropagation方法 evt.stopPropagation ?evt.stopPropagation() : (evt.cancelBubble=true); } - 寫出程序運行的結果?
for(var i=0, j=0; i<10, j<6; i++, j++){ k = i + j; } 10 - 編寫一個方法 求一個字符串的字節長度
/*假設：一個英文字符占用一個字節，一個中文字符占用兩個字節*/ function getBytes(str){ var len = str.length, bytes = len, i = 0; for(; i<len; i++){ if (str.charCodeAt(i) > 255) bytes++; } return bytes; } alert(getBytes("玩,as")); - JavaScript中如何對一個對象進行深度clone？
function cloneObject(o) { if(!o || ‘object‘ !== typeof o) { return o; } var c = ‘function‘ === typeof o.pop ? [] : {}; var p, v; for(p in o) { if(o.hasOwnProperty(p)) { v = o[p]; if(v && ‘object‘ === typeof v) { c[p] = Ext.ux.clone(v); } else { c[p] = v; } } } return c; }; - 如何控制alert中的換行？
\n alert(“p\np”); - 請編寫一個JavaScript函數 parseQueryString，它的用途是把URL參數解析為一個對象，如：
var url = “http://witmax.cn/index.php?key0=0&key1=1&key2=2″;function parseQueryString(url){ var params = {}, arr = url.split("?"); if (arr.length <= 1) return params; arr = arr[1].split("&"); for(var i=0, l=arr.length; i<l; i++){ var a = arr[i].split("="); params[a[0]] = a[1]; } return params; } var url = "http://witmax.cn/index.php?key0=0&key1=1&key2=2", ps = parseQueryString(url); console.log(ps["key1"]); - 如何控制網頁在網絡傳輸過程中的數據量?
啟用GZIP壓縮 保持良好的編程習慣，避免重復的CSS，JavaScript代碼，多余的HTML標簽和屬性 - 以下代碼運行結果
function say() { // Local variable that ends up within closure var num = 888; var sayAlert = function() { alert(num); } num++; return sayAlert; } var sayAlert = say(); sayAlert();//889 - 請實現ECMAScript 5中的Object.getPrototypeOf() 函數
function proto(object) { return !object? null : ‘__proto__‘ in object? object.__proto__ : /* not exposed? */ object.constructor.prototype } - 如何實現Array.prototype.forEach？
if (!Array.prototype.forEach) { Array.prototype.forEach = function(fn){ for ( var i = 0; i < this.length; i++ ) { fn( this[i], i, this ); } }; } ["a", "b", "c"].forEach(function(value, index, array){ assert( value, "Is in position " + index + " out of " + (array.length - 1) ); }); - 如何將arguments轉為數組？
Object.prototype.slice.call(arguments); - 以下程序運行結果？
var ninja = function myNinja(){ alert(ninja == myNinja); }; ninja(); myNinja(); true、報錯（error - myNinja is not defined.） - 如何獲取光標的水平位置？
function getX(e){ e = e || window.event; //先檢查非IE瀏覽器，在檢查IE的位置 return e.pageX || e.clentX + document.body.scrollLeft; } - 兼容瀏覽器的獲取指定元素（elem）的樣式屬性（name）的方法
function getStyle(elem, name){ if(elem.style[name]){//如果屬性存在於style[]中，直接取 return elem.style[name]; } else if(elem.currentStyle){//否則 嘗試IE的方法 return elem.currentStyle[name]; }//嘗試W3C的方式 else if(document.defaultView && document.defaultView.getComputedStyle){ name = name.replace(/([A-Z])/g, "-$1");//W3C中為textAlign樣式，轉為text-align name = name.toLowerCase(); var s = document.defaultView.getComputedStyle(elem, ""); return s && s.getPropertyValue(name); }else{ return null; } } - Javascript中實現類似PHP的print_r函數
function print_r(theObj) { var retStr = ‘‘; if(typeof theObj == ‘object‘) { retStr += ‘<div style="font-family:Tahoma; font-size:7pt;">‘; for(var p in theObj) { if (typeof theObj[p] == ‘object‘) { retStr += ‘<div><b>[‘+p+‘] => ‘ + typeof(theObj) + ‘</b></div>‘; retStr += ‘<div style="padding-left:25px;">‘ + print_r(theObj[p]) + ‘</div>‘; } else { retStr += ‘<div>[‘+p+‘] => <b>‘ + theObj[p] + ‘</b></div>‘; } } retStr += ‘</div>‘; } return retStr; } - 以下程序運行結果？
var b = parseInt("01"); alert("b="+b); var c = parseInt("09/08/2009"); alert("c="+c); b=1、c=0。 - 以下程序的運行結果？
var foo = ‘hello‘; (function() { var foo= foo || ‘world‘; console.log(foo); })(); world - 如何規避javascript多人開發函數重名問題？
(1) 可以開發前規定命名規範，根據不同開發人員開發的功能在函數前加前綴 (2) 將每個開發人員的函數封裝到類中，調用的時候就調用類的函數，即使函數重名只要類名不重復就行 - 前端開發有哪些優化問題？
減少http請求次數：cssspirit,data uri JS，CSS源碼壓縮 前端模板JS+數據，減少由於HTML標簽導致的帶寬浪費，前端用變量保存AJAX請求結果，每次操作本地變量，不用請求，減少請求次數 用innerHTML代替DOM操作，減少DOM操作次數，優化javascript性能 用setTimeout來避免頁面失去響應 用hash-table來優化查找 當需要設置的樣式很多時設置className而不是直接操作style 少用全局變量 緩存DOM節點查找的結果 避免使用CSS Expression 圖片預載 避免在頁面的主體布局中使用table，table要等其中的內容完全下載之後才會顯示出來，顯示比div+css布局慢 - AJAX請求總共有多少種CALLBACK
Ajax請求總共有八種Callback onSuccess onFailure onUninitialized onLoading onLoaded onInteractive onComplete onException - 請給出異步加載js方案，不少於兩種
異步加載方式： defer，只支持IE async： 創建script，插入到DOM中，加載完畢後callBack，見代碼： function loadScript(url, callback){ var script = document.createElement("script") script.type = "text/javascript"; if(script.readyState){ //IE script.onreadystatechange = function(){ if (script.readyState == "loaded" ||script.readyState == "complete"){ script.onreadystatechange = null; callback(); } }; } else { //Others: Firefox, Safari, Chrome, and Opera script.onload = function(){ callback(); }; } script.src = url; document.body.appendChild(script); }
前端javascript知識（二）