09 2012 档案

Javascript Patterns--读书笔记7 (singleton)
摘要：singleton是指对于一个特定的类，只会产生一个实例。这就是说，当你第二次用这个class去创建一个新对象时，你会得到第一次创建的那个对象。在JS中，要如何实现呢？在JS中没有类，当我们创建一个新的对象时，这个对象实际上就是singleton.当我们用直接量来创建一个对象时，这实际上就是一个新的singleton实例：var obj= { myprop: 'my value'}Using newJS中没有类，所以照字面意思来套用singleto是没有什么意义的。但是在JS中可以用new通过constructor来创建对象，而当你用new来创建一系列对象的时候，如果想得到返回 阅读全文
posted @ 2012-09-29 17:16 moonreplace 阅读(250) 评论(0) 推荐(0)
Javascript Patterns--读书笔记6 (Code Reuse)
摘要：提到代码重用，我们往往会想到inherits,当然还有其它的方式 ，我们还可以通过compoite来达到代码重用的目的。不过，当我们在试图实现代码重用的时候，请记住“Prefer object composition to class inheritance"Classical Versus Modern Inheritance Patterns在JS中什么是Classical继承呢，这个命名方式不是通用的。所表达的意思其实就是别的语言中的类继承。因为在JS中不存在类这个概念，我们可以随时改变它的属性和方法，而不必像其他语言那样麻烦。在JS中，有constructor，还有可以用ne 阅读全文
posted @ 2012-09-25 21:36 moonreplace 阅读(392) 评论(0) 推荐(0)
Javascript Patterns--读书笔记5 (Object Creation Patterns)
摘要：在JS中创建一个对象是非常简单的，可以利用直接量 var object={}，也可以用constructor var object = new Object().而且它本身没有特殊的语法，像什么命名空间，modules, packages, private properties和static members.在下面的内容中将会集中展示,命名空间模式，依赖声明，module模式和sandbox模式，它们可以帮助你更好的组织你的代码。Namespace Patternnamespace可以帮助我们的程序尽力减少对全局变量的污染，这样我们就可以把命名冲突减小到最低。当然javascript并没有提供 阅读全文
posted @ 2012-09-20 21:22 moonreplace 阅读(299) 评论(0) 推荐(0)
Javascript Patterns--读书笔记4 (Functions)
摘要：Functions是JavaScript中一非常重要的一部分，主要体现在两方面：一是first-class objects,二是它会提供运行的scope.named function expression:var add = function add(a,b){ return a+b;}anonymous function:var add = function (a,b) { return a + b;};这两者完成的功能是一样的，但有什么区别呢：区别就在于，当我们试图去取function.name的时候，named function expression将会得到add,而anonymou.. 阅读全文
posted @ 2012-09-17 22:51 moonreplace 阅读(187) 评论(0) 推荐(0)
fireEvent是什么？
摘要：最近在读jQuery 1.8.1的code,在读到support函数的时候，它在对IEclone node的时候会一同clone绑定的events的时候，用到了fireEvent函数。如下代码if ( !div.addEventListener && div.attachEvent && div.fireEvent ) { div.attachEvent( "onclick", clickFn = function() { // Cloning a node shouldn't copy over any // bound event 阅读全文
posted @ 2012-09-16 20:15 moonreplace 阅读(2881) 评论(0) 推荐(0)
Javascript Patterns--读书笔记3 ( Literal and Constructors )
摘要：literal其实类似于我们可以对array, function, object...这些由基本类型(string, number,boolean,null, undefined)所组成的复合类型，像简单类型那样来赋值，而不需要动用new来操作。Object Literal:实际上javascript中的object类似于hash table中的键值对，它的值可以是基本类型，当然也可以是别的object,我们称之为属性。如果值是function,我们就称他们为method.来看下面的定义object的方法：View Code 利用Constructor创建Objectjs中虽然没有类，但是依然 阅读全文
posted @ 2012-09-13 17:47 moonreplace 阅读(241) 评论(0) 推荐(0)
JS中的数组去重复元素
摘要：去掉数组中的重复元素，在JS中即可以利用常规方法来一一比较，然后把其中的不重复元素加入到结果数组中，也可以利用JS中的对象特性来完成特定数组类型的去重。因为在JS中它是非强类型的语言，所以在我们的数组中会出现object, function, number, string, null, undefined, bool.如果是这种情况，下列列出的代码有可能不能完成。常规方法：遍历最初的数组，拿出一个元素，和结果数组中的每一个进行比较，如果没有重复，即将新元素插入结果数组。View Code var originalArray=["test","0", 1, 阅读全文
posted @ 2012-09-10 22:22 moonreplace 阅读(1374) 评论(0) 推荐(0)
Backbone学习笔记---View, Collections
摘要：在Backbone中，views并不含有markup，它们通常会用JS templating(例如：Mustache, jQuery-tmpl).一个view的render()方法可以绑定到model's change事件上，这样就可以达到不用刷新整个page,只用刷新部分就可以了。创新一个新的ViewView Code var PhotoSearch=Backbone.View.extend({ el:$('#results'), render:function(event){ var compiled_template=_.template($('#resu 阅读全文
posted @ 2012-09-08 09:23 moonreplace 阅读(653) 评论(0) 推荐(0)
Javascript Patterns--读书笔记2
摘要：Writing Maintainable code有人愿意修bug吗？这不是废话吗?（反正我不愿意修），bug总是不可避免的，我们会花大量的时间来修bug，下面的时间总是我们不可避免的：搞清楚是什么问题理解code,然后再去尝试解决问题如果在一个大的公司或者是一个大的项目中，我们花在第一项的时间会很多。所以我们在写code的时候需要遵守一些规则：可读性好保持一致性可预见性好有良好的文档Minimizing GlobalsJS是用functions来管理scope的。如果一个变量声明在一个function内，那么它就是一个本地变量，在外部是不可用的。那么global的变量是在任何function 阅读全文
posted @ 2012-09-07 18:08 moonreplace 阅读(203) 评论(0) 推荐(0)
Javascript Patterns--读书笔记1
摘要：JavaScript基础知识1.面向对象，Javascript是天生的面向对象的语言，它和我们传统意义上的理解的面向对象语言不一样，其实，我们所接触到传统面向对象语言(C#, Java)更应该称之为面向类的语言。2.五种原生的数据类型： number, string, boolean, null, undefined.而前三种都有相应的对象来表示。所以number, string, boolean可以很方便的转化成相应的对象。3. 在JS中最重要的Function也是对象。4.有两种类型的objects，我们必须谨记。Native:ECMAScript标准所定义的。 Host: host en 阅读全文
posted @ 2012-09-07 10:46 moonreplace 阅读(171) 评论(0) 推荐(0)
Backbone学习笔记---Model
摘要：Backbone中的model实际上包含了程序所要用到的一些交互数据，即给表现层提供数据，也为了从后台得到数据。例如我们可以用一个model来表示photo object,它需要包含一些属性，像tags, titles和location，看代码：var Photo=Backbone.Model.extend({ defaults:{ src:'placeholder.jpg', title:'an image placeholder', coordinates:[0,0] }, initialize:function(){ ... 阅读全文
posted @ 2012-09-06 21:54 moonreplace 阅读(400) 评论(0) 推荐(0)
jsbin.com一个非常好的在线调试JS,CSS工具网站
摘要：如果我就想调试一个JS功能，就想实验一个css函数，就想做一个小例子，我不用从<!DOCTYPE>开始写吧，如果你以前这么做了那是你不知道有这个网站：初识：我想这个够清晰明了的了吧，你可以在html中输入你想要的html代码，如果你想调试css, js可以在相应的框中输入你想要的东西。惊艳：我想要用到某个库怎么办，我还需要去下，然后把它们放到本地吗？或者是去找google CDN, jquery cdn....点击Add Libiray有你想要的吗？贤惠：如果我想要把我写的这段代码分享出去怎么办你还在等什么，试一下呗? 阅读全文
posted @ 2012-09-05 16:50 moonreplace 阅读(694) 评论(0) 推荐(0)
如何让浏览器来辨识你的CSS
摘要：问题描述：当我们提到做浏览器兼容时（主要是IE和现代浏览器），可能你的脑海中首先想到的是用hack来兼容各个浏览器，但是请注意尽量不要用行内的hack,如果你用了，不知道你有没有想到过，当你的css有几千行时，而你为了找寻一个IE6 bug时，你会多么的痛苦，所以要合理使用hack.解决方案：1. 利用IE提供给我们的条件判断语句来区分IE和其他的浏览器,以及他自身的各个版本，请看如下代码：<link rel="stylesheet" href="all.css" /><!--[if gt IE 7]> IE7以上版本可识别 &l 阅读全文
posted @ 2012-09-05 16:20 moonreplace 阅读(653) 评论(0) 推荐(0)
解决IE6中背景图片不缓存的问题
摘要：问题描述:我们发现在IE6下当鼠标mouseover一个元素时，会发现抖一下，即突然消失又突然出现，而在别的browser下是好的。那我们首先应该想当的是检查当前元素是不是应用了背景图片，如果用到了，那么就应该考虑如下：很有可能是因为IE6不缓存背景图片所导致的bug.例如: button{background:url(buy.jpg);}解决方案：我们可以在页面中加入如下script来解决这个问题:document.execCommand("BackgroundImageCache",false,true);如上代码告诉浏览器，如果本地存在背景图片的时候，就不要麻烦服务器 阅读全文
posted @ 2012-09-05 14:47 moonreplace 阅读(364) 评论(0) 推荐(0)