前端javascript知识（二）

• 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 closurevar 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-alignname = 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){ //IEscript.onreadystatechange = function(){if (script.readyState == "loaded" ||script.readyState == "complete"){script.onreadystatechange = null;callback();}};} else {
  //Others: Firefox, Safari, Chrome, and Operascript.onload = function(){callback();};}script.src = url;document.body.appendChild(script);
  }