随笔分类 - JavaScript模式
摘要:引子博客断了一段时间,不是不写,一是没时间,二是觉得自己沉淀不够,经过一段时间的学习和实战,今天来总结下一个老生常谈的东西: 代码复用。为何复用JS门槛低,故很多人以为写几个特效就会JS,其实真正混前端的人都知道,JS写的好和写的不好差距是很大的,前段时间看到一个前端为了实现一个浮层的显示与隐藏花了100多行代码,去遍历各个子元素,挨个去设置display。还有一个很常见的场景,为了给一个UL下面的n个li绑定事件,遂遍历所有的li去bind,这些例子在日常的开发中,比比皆是,为什么有这种情况,一和业务有关,而他们压根不知道有更好的方式。造成这张现象的深层次原因无非有两种,一是他们无意去优化自
阅读全文
摘要:引子 上一篇说了模块模式,而对于其中的命名空间模式其实也是有着一些问题,比如每添加一个模块或则深入叠加都会导致长命名,并且对于多个库的不同版本同时运行,一不小心就会污染全局标识,而这两天也发现了JSer对此也有解决办法,由于不是特别喜欢这种模式,但是在YUI3中大量的用到了这种模式,顾从网上扒了一篇来说明一下,这种模式就是沙箱模式。 什么是沙箱模式 沙箱模式(Sandbox Pattern)...
阅读全文
摘要:引子这篇算是对第9篇中内容的发散和补充,当时我只是把模块模式中的一些内容简单的归为函数篇中去,在北川的提醒下,我才发觉这是非常不严谨的,于是我把这些内容拎出来,这就是这篇的由来。什么是模块模式在JavaScript中没有包(Package)的概念,而面对日益庞大的JavaScript代码,而这正促使模块化开发的迫切需求,所以也就诞生了JavaScript的模块模式, 最早这么叫的是老道,他称之为 模块模式 (Module Patterns).模块模式提供了用于创建独立解耦的代码片段的工具,这些代码可以被当成黑盒,当你正在写的软件需求发生变化时,这些代码可以被添加、替换、移除。模块模式是好几种模
阅读全文
摘要:写在前面 不知不觉写到第10篇了。这篇写起来很忐忑,终于和高级搭上边了(呵呵),这篇我们 主要 说一下 JS 方法的部分高级用法(我知道的),笔者水平有限,难免有错。废话不多少,进入正文。 初始化 我们在看一些别人写的优秀的代码,特别是组件时,我们经常能发现有init或initializa这样的方法,它一般执行的都是初始化。那初始化一般都有几种呢,我们来一一介绍: 初始化对象 初始化对象...
阅读全文
摘要:回调模式 上一篇,对JavaScript函数进行了大体的介绍,这一篇对一些在工作中经常遇到的情况进行扩展。 在工作中,我们经常遇到很多需求,比如现在有一个需求: 一栋10层的大楼,当我们在坐电梯时,电梯每上一层,每层的电梯显示屏上即时显示电梯当前所在的楼层。 这样我们可能不到1s,就想到了解决方案,只要电梯每上一层,把每一层的电梯显示屏数字 +1 ,代码核心如下: ```javascr...
阅读全文
摘要:什么是函数 函数,是一个大型程序中的某部份代码,由一个或多个语句块组成。它负责完成某项特定任务,而且相较于其他代码,具备相对的独立性。(维基百科) 函数的特点 第一类对象 在JavaScript世界中函数是一等公民,它不仅拥有一切传统函数的使用方式(声明和调用),而且可以做到像简单值一样赋值、传参、返回,这样的函数也称之为第一级函数(First-class Function)。不仅如此,J...
阅读全文
摘要:组合使用构造函数模式和原型模式 上篇,我们提到了原型模式的缺点,就是每个实例不能拥有自己的属性,因为纯原型模式所有的属性都是公开给每个实例的,故我们可以组合使用构造函数模式和原型模式。构造函数用来定义实例的属性,而原型模式用来定义方法和公用属性。这样的话,每个实例都有自己的属性副本(而不是指向原型的引用),同时它也共享原型上方法的引用。而且,这种混合模式还支持对构造函数传参,所以可以说是结合了两种...
阅读全文
摘要:原型与in操作符 有两种方式使用in操作符:单独使用和在for-in循环中使用。 在单独使用时,in操作符会遍历实例公开(可枚举)的属性,如果找到该指定属性则返回true,无论该指定属性是存在与实例中还是原型中。直接上代码: ```javascript function Animal(){ } Animal.prototype...
阅读全文
摘要:什么是原型模式?原型模式(prototype)是指用原型实例指向创建对象的种类,并且通过拷贝这些原型创建新的对象。--引自JavaScript设计模式我们创建的每一个函数都有一个prototype属性,这个属性是一个指针,指向一个对象,而这个对象包含了所有由指向他的构造函数所生成的实例的共享属性和方法。说的通俗点,就是一个对象包含了一些属性和方法,而所有prototype为这个对象的构造函数所创建的实例都可以共享这个对象的属性和方法。直接上代码:```javascript function Animal(type){ this.type = ty...
阅读全文
摘要:什么是构造函数?构造函数 是一种特殊的方法 主要用来在创建对象时初始化对象 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中 特别的一个类可以有多个构造函数 可根据其参数个数的不同或参数类型的不同来区分它们 即构造函数的重载 ---引自百度百科在JavaScript中是没有类的,但是我们有构造函数(是不是很怪),很深的东西我也说不来,直接上代码:```javascript //工厂模式 function createCat(name){ var o = {}; o.name = ...
阅读全文
摘要:什么是字面量? 在编程语言中,字面量是一种表示值的记法。例如,"Hello, World!" 在许多语言中都表示一个字符串字面量(string literal ),JavaScript也不例外。比如举几个JavaScript字面量的例子,如5、true、false和null,它们分别表示一个整数、两个布尔值和一个空对象。 咋一看,可能很绕,字面量很难下定义,其实以我的理解就是一眼能理解的量就是...
阅读全文
摘要:尽量少用全局变量 大量使用全局变量会导致的后果 全局变量创建以后会在整个JavaScript应用和Web页面中共享。所有的全局变量都存在于一个全局命名空间内,很容易发生冲突 不知不觉创建了全局变量 其原因在于JavaScript的两个特性,第一个是JavaScript可直接使用变量而无需声明,第二个是JavaScript的暗示全局变量的概念,即任何变量如果未经声明,就为全局对象所有 ...
阅读全文
摘要:什么是模式? 广义上的模式是指 :在物体或事件上,产生的一种规律变化与自我重复的样式与过程。在模式之中,某些固定的元素不断以可预测的方式周期性重现。最基本而常见的模式,称为密铺,具备重复性以及周期性两大特征。找寻出固定模式是人类基本的认知功能之一。(从wiki百科抄的) 碉堡了,啥玩意这么绕。。。而在我们软件的开发过程中,模式通常可以理解为解决一类问题的方法或方案。(我的理解是解决一些具有共同点的问题的方法) 模式有什么好处? 我们在采用一种新的技术或者语言之前,会衡量他对我们目前乃至以后的开发会产生什么后果,是好的还是坏的。通过学习模式,我们可以使用经过实践证明有效的经验来编写代码,而无需去
阅读全文