11 2013 档案
摘要：假设需求为：在当天晚上0:00过期。方法：得到当天晚上0:00这个时间点的一个时间。function getNextDate(){ var d = new Date(), year = d.getFullYear(), month = d.getMonth(), day = d.getDate(), nextDay = new Date( year, month, ( day + 1 ), 00, 00, 00 ); return nextDay; },接下来是设置cookie：$.cookie("someKey", "someVal", {expire
阅读全文
摘要：jQuery().end()的作用是返回当前jQuery对象的上一个状态。1、end()源码： // 所有通过pushStack方法获得的jQuery对象都可以通过end方法返回之前的状态 // 如果有preObject对象这返回该对象，否则调用构造函数返回jQuery的空对象 end: function() { return this.prevObject || this.constructor(null); }, end()的源码很简单，但是需要了解prevObject是如何形成的，所以需要了解pushStack方法都做了什么。2、pushStack()源码： pushS...
阅读全文
摘要：该方法是绑定在jQuery.prototype上的一个静态方法，目的是取出jQuery对象中的某个或全部DOM元素。使用方法： $("someDOM").get(index); 此时会获取到$("someDOM")这个jQuery对象中第index个DOM元素。源码：get: function( num ) { // 如果get不传如参数，则返回当前jQuery对象中的所有DOM元素的数组形式。（jQuery对象是类数组，内部包含一个数组） return num == null ? this.toArray() : // 如果传入如果num是负数，则从数
阅读全文
摘要：// 初始化jQuery对象，即jQuery.fn.init对象 // @param selector 选择器，可能是DOM对象、html字符串、jQuery对象、函数或其他任意值。 // @param context 选择器选择的范围 // @param rootjQuery == $(document); init: function( selector, context, rootjQuery ) { var match, elem; //如果selector是""、null、undefined、false，则返回this，这里的this指针指向init对象 //如果
阅读全文
摘要：1、如果变量中只包含字符、数字、下划线，可以将变量直接写在双引号中，如："my name is $name"2、如果带有其它字符，如“.”，则需要将变量用单引号括起来，如：“my name is '$name.cl'”3、双引号中不仅可以嵌入变量，还可以加入修饰符对变量进行修饰。如：“my name is ”
阅读全文
摘要：1、变量赋值的两种写法 2、作用范围使用scope来定义 //仅当前模板内有效 //当前模板和包含该模板的模板内可见 //该变量在相关模板内都可见
阅读全文
摘要：smarty提供了一个获取时间戳的方法：使用该方法获取到当时的时间戳之后，使用格式化修饰符data-format进行修饰：'%Y-%m-%d %H:%M:%S'
阅读全文
摘要：1、模块重构需要考虑新版和老版的过渡风险，魔抗重构代码修改量很大，风险很高。再加上多国家同时更改，风险会更高，所以需要考虑过渡方案。2、对耦合的模块进行拆分，尽量减少耦合。3、重构完成后需要请大家进行codereview，发现其中的问题，使方案最优化。4、遵守最新的代码规范。
阅读全文
摘要：由于js声明提前的作用，所以在js中后面定义的函数也可以再前面使用。不过，项目中看到过这样的写法var a = function(){}, b = function(){};这种写法使代码看上去很整齐。虽然js对声明可以提前。比如，会对a、b变量的声明提前。但是此时a、b变量并未赋值。所以，在a中调用b就会出现调用失败。个人觉得这种写法不值得推广。
阅读全文
摘要：1、之前听到api静态化预案，一直以为是前端发送api请求，如果api请求失败，则再次发送一条请求，去请求备份的静态资源。2、前两天了解到的api静态化预案是这样的：在请求api时，给api请求加上一个特定的参数，后端如果数据不正常，则根据该参数返回对应的备份数据。问题：具体实现不清楚。后续请教鸟哥或者明飞。
阅读全文
摘要：1、危险：当记录了过多的cookie时，可能导致http header过大，进而导致服务器端发生错误，导致用户无法打开页面。2、cookie限制： 各浏览器对单cookie键的限制基本都在4kb左右。上下可能有30多b的差别。差别基本不大。 但对cookie总大小的限制却差别很大。其中chrome和IE8-的允许的总大小最小，为chrome 4997b，IE8- 4096b。因此总大小也基本需要限制在4000b以下。 个数超出时，firefox采取随机删除的策略，其它浏览器采取先进先出的策略。 单个cookie大小超出时，所有浏览器都不进行写入。 总字节数超出时，firefox不进行...
阅读全文
摘要：在项目中，框架和内容的耦合带来了很多麻烦事儿。1、由于PM的需求不断变化，耦合在框架js中的内容js越来越多。2、由于并不是所有国家都需要的js也同样需要加载，浪费了性能。3、所有框架css和内容css都写在一个css文件中。导致所有国家都需要下载一些不必要的css。4、逻辑越来越复杂，维护成本不断提高。解决方法：1、框架只负责获取所需内容的数据，内容内部逻辑自行处理。2、两个js之间的通信依赖全局对象中模块对应的属性进行。框架获取到内容依赖的数据后抛给该属性，内容则从该属性中取出对应的数据执行。
阅读全文
摘要：优点：每个模块只有一个ID，并且在css中不适用ID，ID从模板中传入js中，则该模块的复用灵活性会非常高。想要复用该模块时，只需要改动两个地方。一个是html中的ID，另外一个是写到全局conf.模块名.id中的ID字符串。js和css不需要改动。缺点：限制了ID的使用，在js中选择DOM元素时，效率会有所下降。
阅读全文
摘要：1、jQuery有个很好用的方法是 end();2、在进行链式操作时，使用end方法，可以回溯到上一个jQuery对象。3、实现原理：jQuery内部有一个对象栈，当形成新的对象时，会将新对象推入到对象栈中。而当使用end方法时，时间上是回到对象栈的上一个状态，即prevObject。只有当使用jQuery内部的pushStack方法构建jQuery对象时才会将对象推入到对象栈中。
阅读全文
摘要：数据库工作任务内存超过可用的RAM内存长/短查询写入冲突大连接（join）占用内存虚拟化共享一个HDD、磁盘寻死（disk seek death）在云端网络I/O波动编程线程：死锁、调试、非线性扩展等事件驱动编程：callback()过于复杂、如何在函数调用中存储有状态等缺乏调优、跟踪、日志等单模块不可扩展、单点故障(SPOF:Single Point Of Failure)、非横向扩展等有状态应用程序设计问题：开发的应用程序只在自己的机器行运行正常，或者只是在几个人测试的时候正常（没有经历压力测试）。算法过于复杂相关服务，例如DNS查找以及其他可能屏蔽的服务堆栈空间磁盘访问本地磁盘随机访问磁
阅读全文
摘要：1、一般情况下，我们会为img标签设置width和height属性来解决图片占位问题。但设置width和height属性并不能解决所有浏览器图片占位问题。2、设置图片占位在chrome和IE中生效，但在firefox中如果图片加载失败，并不会为图片预留width和height属性设置的大小。3、解决的方法是：除了设置width和height属性外，添加一个内联的style属性style="display:block" 或者"display:inline-block;"4、原因分析：可能在firefox中，由于img是行内元素，在其加载之前所以无法为其设置
阅读全文
摘要：bigpipe:先输出页面的整体布局，在按块输出输出页面的每个部分。这样可以让服务器的运算、网络的传输和浏览器的渲染并行。适用于服务器运算较慢的时候。bigrender：主要在浏览器端，先将字符串存放于textarea或者script的标签（不可知性的type）中。当用户触发时才将textarea或者script中的html取出插入相应的DOM节点。（理解不够深入，需要继续了解。。。。）
阅读全文
摘要：从网页性能的角度来看，DNS的解析时间是比较耗时的。因此如果能预先下载网页中用到的其它域的资源。可提前进行DNS解析：预加载网页或静态资源的方法为：
阅读全文
摘要：1、$.when(ajax).done(function(data)});2、$.ajax().done(function(data){});1中的data被封装进一个对象[data, "success", aboutData]data为返回的数据“success”为返回的信息状态，表示成功或失败aboutData为数据相关的信息2中只包含data信息，不包含状态和相关信息
阅读全文
摘要：1、取得当地时间与GMT时间的时间差 (new Date()).getTimezoneOffset() //单位为分钟2、GMT时间加上与当地时间的时间差 (new Date(GMTTime)) + (new Date()).getTimezoneOffset() * 600003、获得当地时间的毫秒数之后，转换为Date对象，之后调用Date对象的相关方法获取需要的数据。
阅读全文
摘要：window.postMessage1、浏览器兼容情况：IE8+、chrome、firefox等较新浏览器都至此。2、使用方法： a、otherWindow.postMessage( message, targetOrigin); otherWindow iframe属性中的对象或者window.open打开的窗口 message 要发送的信息 targetOrigin 限定消息的发送范围，如果不限制，使用“*” b、监听message事件的触发 $(window).on("message", function(event){ aler...
阅读全文
摘要：模板的处理步骤：1、将模块的html、css、js封装进一个json格式的文件。例如{"html":"", "style":"", "script":""}。或者直接将style字段的内容直接内嵌到html字段中。2、将该文件部署到服务器的某个静态资源文件夹中。3、绑定事件触发ajax请求，url指定到服务器上对应的静态资源文件。4、在返回的数据中，取出html和style插入页面DOM5、在返回的数据中，出去script，执行globalEval。注意点：1、js需要包裹在
阅读全文
摘要：1、有没有可能对线上报错进行实时监控，只要线上报错出现就会以邮件的形式发出来。2、有没有可能将每个模块和开发者联系起来，只要报错就直接报给开发者
阅读全文
摘要：浏览器基本上包括如下几个组件1、HTML、XML、CSS、JavsScript解析器2、Layout3、文字和图形渲染4、图像解码5、GPU交互6、网络访问7、硬件加速
阅读全文
摘要：监控图片加载可以采用$(".some-img").load(function(){ alert("loaded");});但是图片默认是读缓存的，第一次加载可以监控到，但之后的加载就无法监控到了。解决方法：1、可以为图片加时间戳，每次都去请求图片，但这显示不是一个好的做法。2、将之前的代码嵌入some-img标签的前面，避免图片load之后才为其绑定load事件。
阅读全文
摘要：当实现轮播时，如果几张图片依次摆放。则从1直接切换到5的时候，会经过2-3-4的切换，让用户头昏眼花。两种解决的方法：1、把图片放入dom中，每次点击切换时，都把需要的图片从DOM中取出再放到当前图片的后面。2、把图片存放在js的数组中，每次点击切换则从数组中取出需要的图片并插入DOM，切换完成之后然后把当前图片放入数组。两种方案都不需要重复加载图片。第二种方案的好处在于DOM中只存在两张图片，比较整洁。
阅读全文
摘要：1、判断某元素上是否绑定了某种类型的事件 var $events = $("#foo").data("events"); if( $events && $events["click"] ){ doSomething();}2、如何验证某个元素是否为空 方法一if (! $('#keks').html()) { //什么都没有找到;} 方法二if ($('#keks').is(":empty")) { //什么都没有找到;}3、如何在jQuery对象中找出某个元素的索引
阅读全文
摘要：setTimeout(function(){alert(1);}, 1000);在使用setTimeout、setInterval的时候，会传一个时间来控制代码的执行时机。在经过了设置的时间段后，代码开始执行。这看上去很像是在异步执行。但是，如果在执行队列中之前的代码执行了超过设置的时间时，例如function test(){ setTimeout(function(){alert(1);}, 1000); while(true){}}此时，由于while执行的时间一定会超过1s，所以alert并不会按照预期在1s之后出现。
阅读全文
摘要：范例：function C (){ this.a = 1; return { b : 2 }; } var c = new C(); alert(c.a); //undefined当构造函数使用return返回对象时，使用new操作符产生的对象并不是一个包含属性a的对象，而是return回来的对象。这种情况只发生在构造函数返回对象时，如果使用reuturn返回的是其它非对象类型的值，将会正常返回包含属性a的对象。
阅读全文
摘要：1、回归历史源代码会诱使程序员重新产生更多的障碍集群。逻辑性差的冗余句法令人无法理解！然而，如果它没有中断，请不要去修复。2、如果使用过多的if else，那这段代码一定是不合逻辑的。3、接到项目直接开始写代码容易走入误区，写之前多思考，多调研反而会节省时间4、stackoverflow是个不错的寻求问题答案的地方。5、陷入僵局时，离开电脑、离开项目休息半小时
阅读全文
摘要：1、stop([stopAll], [gotoEnd])方法有两个参数（当然可以不传或直传一个），其中stopAll的意思是清除之后的所有动画。gotoEnd的意思是，执行完当前动画。2、stopAll == true时，停止队列中的所有动画， stopAll ==false时，只停止队列中的当前动画，后续动画继续执行。3、gotoEnd == true时，立即跳到当前动画的末尾， gotoEnd ==false时，停在当前状态。且gotoEnd只有在设置了stopAll的时候才起作用4、在项目中，如果不进行动画队列清理，就会产生动画积累的问题。因此在写入动画时，最好先清除队列中的重复动画。
阅读全文
摘要：1、$.queue或$("elem").queue()是往队列里面添加可执行方法的方法，这个队列在jQuery中默认我fx。2、可以使用queue方法设置队列名称$("cl", arr),其中cl为队列名称，arr为放入这个队列的可执行方法的数组。3、当想要执行这个队列中的方法时，使用$("elem").dequeue()，此时会执行队列中的第一个方法。4、当想要清空队列时，可以使用$("elem").queue("cl", [])。
阅读全文
摘要：1、设置display为none的元素，它的背景图依然会被下载。所以最好是等到该元素需要显示时才给他加上相应的有背景图的class。2、css中虽然ID选择器的优先级比较高，效率也比较高，但灵活性差，由于权重太高，导致私有化。相比而言，class的复用性高。3、书写css时，尽量不要为了提高优先级而在class前面加标签，这与使用jQuery选择器时想反。4、class起名时，尽量将模块名作为前缀，防止命名冲突。5、缓存对象的多级查询，否则每次查询性能较差。6、动画队列的问题。使用stop（true，true）不好，应该再源头上清除动画，使用queue的方法，该方法需要深入了解下。
阅读全文
摘要：1、该方法在jQuery1.5开始被引入。2、用法测试 a、var url1 = "/resource/ar/hometab/index_tab_games.json", url2 = "/resource/ar/hometab/index_tab_image.json", ajax1 = $.ajax( { url : url1 } ), ajax2 = $.ajax( { url : url2 } ); $.when(ajax1, ajax2).done(function(){ ...
阅读全文
摘要：对于jQuery的lazyload插件，一直是我比较想了解的部分。下面是看别人的文章的笔记：1、如何使用 做一个1*1像素的占位图片 将图片src指向占位图片 图片原地址放入data-original属性 为图片设置width、height属性 为需要lazyload的所有图片加上相同的class便于选择 $(".lazy").lazyload();2、如果需要处理没有js的浏览器（需要处理吗？） 3、不可见图片预加载 $("img.lazy").lazyload({ threshold :200});
阅读全文
摘要：function Person( name, age ){ this.name = name; this.age = age; this.sleep = function(){ alert( this.name + "is sleepping....zzzz"); } } function worker( name, age, company, job ){ Person.apply( this, arguments); this.company = company; this.job = job; ...
阅读全文
摘要：当为窗口绑定resize事件时，大部分浏览器会在每改变一个像素就触发一次resize事件。这严重影响了网站的性能。解决方案是：利用settimeout方法为事件发触发的方法设置延迟执行的时间。实现： function lazyScroll( method, context, delay ){ clearTimeout( method.tId ); method.tId = setTimeout( function(){ method.call( context ); },delay ); } function doSomething(){alert(1);} ...
阅读全文
摘要：这两天做了一个跟cookie打交道比较多的项目，把其中重新认识的点记录下来：1、$.cookie(name, value, time)，当time为0时，相当于本句没有执行，并不会将原本记录在用户浏览器中的同域、同名cookie清除。2、如果想要不定时的清除用户浏览器中固定域下固定名称的cookie，可以单独设置一个符号，当PM设置这个符号时，程序就执行cookie的重置工作，但不会影响正常逻 辑的执行。(好像还是不行。。。。)3、$.cookie(name, value, time)，当value设置为数字时，cookie中会自动转化为字符串。因此下次取出cookie时，不是数字而是字符串.
阅读全文
摘要：出现的问题： 1、多次出现线上bug 2、多个项目同时进行时容易手忙脚乱 3、开发效率不高 4、设计思路不清晰原因分析： 线上bug：自测不够充分；对其它模块不了解，导致没有考虑到模块之间的相互影响； 手忙脚乱：规划不够合理 效率不高：经验不足；设计不充分
阅读全文
摘要：“abc”.replace(/b/, "$`") // $`将正则匹配到的字符替换为匹配到的字符左边的字符 aac“abc”.replace(/b/, "$'") //$'将正则匹配到的字符替换为匹配到的字符右边的字符 acc“abc”.replace(/b/, "{$&}") //$&将正则匹配到的字符替换为匹配到的字符 a{b}c“abc”.replace(/a(b)/, "$1") //将正则匹配到的字符替换为正则的第一个匹配组匹配到的字符 bc
阅读全文
摘要：1、由于使用“==”进行比较时，会对进行比较的值进行类型转换，这样可能会掩盖因类型而引发的错误。2、因此在项目中要尽量使用“===”进行比较。在进行比较之前将需要比较的值转换为相同类型之后再进行“===”的比较。3、（foo != 0）可以直接使用（foo），（foo == 0）可以用（！foo）代替。“==”操作符属于js的鸡肋部分，应该避免使用
阅读全文
摘要：1、typeof NaN === "number" //true2、NaN === NaN //false3、NaN ！== NaN //true4、 isNaN(NaN) //true isNaN(0) //false isNaN("oops") //true isNaN("0") //false isNaN("12str") //true判断是否是数字的最好办法function isNumber(value){return typeof value==="number" &&
阅读全文
摘要：1、合并js文件，减少http请求数量。2、对js文件进行压缩3、以gzip的形式提供js4、使js文件可缓存5、使用CDN
阅读全文
摘要：CDN是指内容分发网络，在网络各处架设节点服务器，当用户访问时，CDN系统会根据网络流量、到用户的距离等因素将请求导向离用户最近的节点上。访问过程是：1、用户向浏览器提供要访问的域名。2、浏览器调用域名解析库对域名进行解析，得到最近的缓存服务器的IP3、向缓存服务器发送请求4、缓存服务器接到请求向实际IP发送请求5、获取到内容之后一方面在本地进行保存，另一方面将内容返回给用户6、浏览器展示内容
阅读全文
摘要：对jQuery中的deferred对象的整体认识：Deferred是个工厂类，返回的是内部构建的deferred对象tuples 创建三个$.Callbacks对象，分别表示成功，失败，处理中三种状态创建了一个promise对象，具有state、always、then、primise方法扩展primise对象生成最终的Deferred对象，返回该对象
阅读全文
摘要：1、(function(){ $(window).on("testEvent", function(){ alert(1); }); })(); $(window).trigger("testEvent"); //1在局部作用域中绑定在全局对象上的事件，依然可以在全局作用域中触发2、(function(){ $(window).on("click.test", function(){ alert(1); }).on("click",function(){ alert(2); }); })();...
阅读全文