摘要：有几种方式，但都不完美其一，不断循环，直到达到指定时间function sleep(numberMillis) { var now = new Date(); var exitTime = now.getTime() + numberMillis; while (true) { now = new Date(); if (now.getTime() > exitTime) return; }}其实代码并没有让脚本sleep下来，相反让CPU迅速上到高负荷的附作用。多数现代浏览器会在该段时间内处于假死状态其二，用xhr同步请求后台程序，比如传2000过去，后台就sleep 2秒后再返回，这 阅读全文

摘要：jQuery的serialize模块中有个r20正则var r20 = /%20/g,jQuery.param方法中会将所有的"%20"转成"+"，即提交数据前，数据中如果包含空格，那经过encodeURIComponent后，空格会转成"%20"encodeURIComponent(' ') === '%20'; // true最后需要将"%20"转换成"="再Post提交。这样后台程序接受到的才是真正的空格。关于 encodeURIComponent，见MDC 阅读全文

摘要：前端面试中常被问到的问题之一就是“JavaScript的基本类型有几种？”。 有的回答“数字、字符串、布尔”，有的可能会再加上“Null、Undefined”。而有人可能认为“object”也是基本类型。到底是什么样呢？ 所谓“基本类型（primitive types）”的概念ECMAScript（ 阅读全文

摘要：从cmc那看到的，分享给园友。以下是一个怪异的代码，谁放在面试题会很坑爹的，如下a = { m: function() { this.n = function(x) { alert(x+2) } return 1 }, n: function(x) { alert(x+1) }}a.n(a.m())定义一个对象a，有个方法m，n。n很简单参数x加1后打印。重点在m，它执行时会修改方法n，把x加2后打印。当执行a.n(a.m())是结果是什么呢，2还是3？测... 阅读全文

摘要：1，考察thisvar length = 10function fn(){ alert(this.length)}var obj = { length: 5, method: function(fn) { fn() // ? arguments[0]() // ? }}obj.method(fn)这里的坑主要是arguments，我们知道取对象属于除了点操作符还可以用中括号，这里fn的scope是arguments，即fn内的this===arguments，调用时仅传了一个参数fn，因此length为1。2，函数表达式具名（函数声明同时赋值给另一个变量）或函数声明立即执行时，名仅在该函数.. 阅读全文

摘要：JavaScript默认采用原型继承。虽然没有类(class)的概念，它的函数(function)可以充当构造器(constructor)。构造器结合this，new可以构建出类似Java的类。因此，JavaScript通过扩展自身能模拟类式(class-based)继承。JavaScript和其它面向对象语言一样，对象类型采用引用方式。持有对象的变量只是一个地址，而基本类型数据是值。当原型上存储对象时，就可能有一些陷阱。先看第一个例子var create = function() { function Fn() {} return function(parent) { Fn.prototy. 阅读全文

摘要：这里讨论下对象的内部原型(__proto__)和构造器的原型（prototype）的关系。一、所有构造器/函数的__proto__都指向Function.prototype，它是一个空函数（Empty function）Number.__proto__ === Function.prototype // trueBoolean.__proto__ === Function.prototype // trueString.__proto__ === Function.prototype // trueObject.__proto__ === Function.prototype // tr... 阅读全文

摘要：这是在阅读underscore（1.3.3）源码中看到的，它的each方法 var each = _.each = _.forEach = function(obj, iterator, context) { if (obj == null) return; if (nativeForEach && obj.forEach === nativeForEach) { obj.forEach(iterator, context); } else if (obj.length === +obj.length) { for (var i = 0, l = obj... 阅读全文

摘要：前端开发过程中，经常需要这样的场景。用JS实现将光标定位于输入框最右侧。场景一：编辑图片的描述文字场景二：Script.aculo.us的Ajax.InPlaceEditor类。双击可编辑，编辑后离开可自动更新该区域以上场景都需要JS实现将光标定位于输入框最右侧，却不是通过鼠标点入输入框内。我们知道... 阅读全文

摘要：一、两个中括号相加[] + []中括号没有语句块的作用，因此这里的两个中括号就是一个数组。两个数组（对象类型）相加先要将其转换成值类型（基本类型）。1，转成值类型调用valueOf，[]的valueOf()还是自己var arr = [];arr.valueOf() === arr; // true2，转成字符串，[]的toString是空字符串[].toString(); // ""String([]) // ""结果出来了。两个空字符串相加，结果仍然是空字符串。即这里的“+”指字符串连接而非数字相加。二、大括号和中括号的相加{} + []注意这里的大 阅读全文

摘要：以下运算{}+{}结果是什么？稍等..先了解下+运算符。JavaScript中运算符 “+” 很简单，有两种意思1，字符串连接2，数字相加运算时其它值都将转换成这两个类型。JavaScript中有基本类型（undefined, null, booleans, numbers, strings）、对象类型（objects, arrays）和函数类型（functions）。类型转换时先将对象/函数类型转换成基本类型。然后在根据运算符“+”转成字符串或数字。其它基本类型转成数字 有如下规则Number(undefined) // NaNNumber(null) // 0Number(tru... 阅读全文

摘要：call/apply用来改变函数的执行上下文（this），它们的第一个参数thisArg是个对象，即作为函数内的this。多数时候你传啥函数内就是啥。仅以call示例function fun() { alert(this);}fun.call(1);fun.call('a');fun.call(true);fun.call({name:'jack'}); 分别弹出“1”、“a”、“true”、“[object Object]”。有两种情况需要注意，传null或undefined时，将是JS执行环境的全局变量。浏览器中是window，其它环境（如node）则是gl 阅读全文

摘要：同一个标示符，先后用var和function声明它。最后它是什么呢？var a; // 声明一个变量，标识符为afunction a() { // 声明一个函数，标示符也为a}alert(typeof a);显示的是“function”，即function的优先级高于var。有人觉得这是代码顺序执行的原因，即a被后执行的funcion覆盖了。好，将它们调换下。function a() {}var a;alert(typeof a);结果仍然显示的是“function”而非“undefined”。即函数声明优先于变量声明。我们把代码稍作修改，声明a时同时赋值。function a() {}var 阅读全文

摘要：如下var a = 3;实际有两个步骤：1 初始化a为undefined2 a赋值3 因此会出现一些“匪夷所思”的现象，即JS中变量可以先使用后声明。这在Java中是不允许的。System.out.println(a);int a = 1;编译通不过。但JS可以，如下alert(a);var a;虽然是undefined，但不会报错。说明a的确声明了，且为undefined。如果只是“alert(a)”，没有“var a”的话JS引擎会报错的。alert(a);FF中如下虽然可以先使用再声明，但这样会造成赋值的效果丢失。如下alert(a);var a = 1;这次输出的仍然是undefine 阅读全文

摘要：JS中创建对象可以直接使用直接量的方式，这里讨论的是定义一个构造器(function)的情况。如下function Person(name, age) { this.name = name; this.age = age;}var p = new Person('lily', 20);发现某些库代码中创建正则对象的方式无需new，这让人感到奇怪。如下var reg = RegExp('^he$');测试发现使用或不使用new，最后返回的都是正则对象，且typeof它们都是“object”。var reg1 = new RegExp('^he$') 阅读全文

摘要：操作class是前端开发中经常需要用到的，尤其在分工细的公司。class几乎是JS工程师与页面构建师的桥梁。几乎所有的流行库都提供了class属性操作的几个方法。如addClass/removeClass/toggleClass/hasClass。现在HTML5提供了classListAPI，除了IE（包括IE9/10），其它现代浏览器均支持该属性。重写了下class属性模块。1domClass.has(el, cls)2 domClass.add(el, cls)3 domClass.remove(el, cls)4 domClass.toggle(el, cls)5 domClass.re 阅读全文

摘要：为了叙述简单，这里仅拿width示例。情景一，元素style属性设置了width/heighttest如上，使用el.style.width即可。如果没有在style属性中设置width，那么使用el.style.width将获取不到，如下test 所有浏览器中弹出的是空字符串。即使将样式嵌在页面... 阅读全文

摘要：最简单的莫过于使用click方法<input id="btn" type="button" value="BUTTON" onclick="alert(1)"/><script> var btn = document.getElementById('btn'); btn.click();</script>所有浏览器都弹出了1。把input换成div呢<div id="d1" style="background:gold;widt 阅读全文

摘要：我们经常需要判断某个变量/属性是否为undefined。通常有两种写法// 方式1typeof age === 'undefined';// 方式2age === undefined这两种写法有什么区别吗? 应该使用哪一种呢？看看下面的例子typeof age === 'undefined'; //... 阅读全文

摘要：拿添加事件示例// 方式1function addEvent(el, type, fn){ if(el.addEventListener){ el.addEventListener(type, fn, false); }else{ el.attachEvent('on'+type, fn) }}// 方式2var addEvent = document.addEventListener ? function(el, type, fn) {el.addEventListener(type, fn, false);} : function(el, type, fn) {el.att 阅读全文