谈JavaScript代码封装

前言也算老生常谈的问题了,再深入搞一搞怎么玩儿封装,如果看到这篇文章的你,正好你也是追求完美的代码洁癖狂者,那么这篇文章相信非常适合你. 举一个例子,编写一个Person类,具有name和birthday(时间戳)两个属性及对应的getter和setter方法,注意,setBirthday输入的参数是日期字符串,如"2016-04-08".getBirthday同样得到的也是日期字符串.那么这个类是这样的—— var Person = function(name, birthday)…

浅谈JavaScript代码性能优化

可以通过https://jsbench.me/测试网站完成性能测试. 一.慎用全局变量 1.全局变量定义在全局执行上下文,是所有作用域链的顶端,在局部作用域中没找到的变量都会到全局变量中去查找,所以说查找的时间消耗比较大. 2.全局执行上下文一直存在于上下文执行栈,直到程序退出. 3.如果某个及局部作用域出现了同名变量则会遮蔽或污染全局. 下面通过代码来解析下全局变量存储和局部变量存储性能比较局部变量存储是运行速度更快的二.缓存全局变量将使用中无法避免的全局变量缓存到局部,如下图所示局…

浅谈JavaScript代码性能优化2

一.减少判断层级从下图代码中可以明显看出,同样的效果判断层级的减少可以优化性能二.减少作用域链查找层级简单解释下,下图中第一个运行foo函数,bar函数内打印name,bar作用域内没有name,所以作用域链往上查找,foo内部有name, 但是这种写法实际上是赋值,还要往上查找,全局作用域中查询到name,相比于下图第二个,多向上查了一级,所以时间要长一些. (备注:不考虑内存空间消耗的前提下,具体根据产品来定.) 三.减少数据读取次数简单解释下,对于多次频繁调用,比如数组,对象是比较…

2016/11/17 周四 <javascript的封装简单示例>

这是一个简单的javascript代码封装的示例以及封装后的调用方法: var ticker={ n:0, add:function() { this.n++; }, show:function() { alert(this.n); } } ticker.add(); ticker.add(); ticker.show(); 以下是案例中的代码封装方法,解决了一定的安全问题与代码冗余问题: <!DOCTYPE html> <html> <head> <meta c…

浅谈javascript函数节流

浅谈javascript函数节流什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等等事情,那么这时候窗口缩放的时候,有可能连续发多个请求,这并不是我们想要的,或者是说我们常见的鼠标移入移出tab切换效果,有时候连续且移动的很快的时候,会有闪烁的效果,这时候我们就可以使用函数节流来操作.大家都知道,DOM的操作会很消耗或影响性能的,如果是说在窗口缩放的时候,为元素绑定大量的dom操…

引爆你的Javascript代码进化

转自:http://www.hicss.net/evolve-your-javascript-code/ 方才在程序里看到一段JS代码,写法极为高明,私心想着若是其按照规范来写,定可培养对这门语言的理解,对JS编程能力提高必是极好的.说人话:丫代码写的太乱,看的窝火! 最近闲暇无事,准备对自己JS学习做一个总结.众所周知,JS是一种语法极其灵活的语言,一千个人会有一千种JS书写方式.这造成的结果往往就是给项目日后的开发及维护留下一个不小的隐患,也对你和团队再次开发及阅读代码造成一定困难,个人认为…

引爆你的Javascript代码进化 (转)

转自海玉的博客方才在程序里看到一段JS代码,写法极为高明,私心想着若是其按照规范来写,定可培养对这门语言的理解,对JS编程能力提高必是极好的.说人话:丫代码写的太乱,看的窝火! 最近闲暇无事,准备对自己JS学习做一个总结.众所周知,JS是一种语法极其灵活的语言,一千个人会有一千种JS书写方式.这造成的结果往往就是给项目日后的开发及维护留下一个不小的隐患,也对你和团队再次开发及阅读代码造成一定困难,个人认为良好的书写规范是应该首当其冲的.所以参考一些优秀前端开发团队的代码规范后,总结了几点,希…

【Web技术】399- 浅谈前端代码加密

作者简介:于航,PayPal Senior Software Engineer,在 PayPal 上海负责 Global GRT 平台相关的技术研发工作.曾任职于阿里巴巴.Tapatalk 等企业.freeCodeCamp 上海社区负责人.研究领域主要为前端基础技术架构.Serverless.WebAssembly.LLVM 及编译器等相关方向. 说到 Web 前端开发,我们首先能够想到的是浏览器.HTML.CSS 以及 JavaScript 这些开发时所必备使用的软件工具和编程语言.而在这个专…

浅谈:javascript的面向对象编程之具体实现

下面的javascript代码都是需要使用jQuery插件来做的.希望大家可以搭建好工作环境首先我们来做一个练习:在一个删除的超链接中添加一个提示信息,提示是否确认删除. 一般情况下我们都会这么做 <html> <head> <title>delete.html</title> </head> <script type="text/javascript"> function deleteTest(){ windo…

如何让你的JavaScript代码更加语义化

语义化这个词在 HTML 中用的比较多,即根据内容的结构化选择合适的标签.其作用不容小觑: 赋予标签含义,让代码结构更加清晰,虽然我们可以在标签上添加 class 来标识,但这种通过属性来表示本体的形式会显得不够直接,而且在一定程度上也有冗余. 优化搜索引擎(SEO),结构良好的网页对搜索引擎的亲和力是很高的,百度和 google 也给出了很多网页结构化的建议(规范),方便他们抓取网页. 利于设备解析,如盲人阅读器对页面的分析,目前淘宝很多网页都是支持盲人阅读的,这种体验上的优化得利于网页的良好…

使用 Promises 编写更优雅的 JavaScript 代码

你可能已经无意中听说过 Promises,很多人都在讨论它,使用它,但你不知道为什么它们如此特别.难道你不能使用回调么?有什么了特别的?在本文中,我们一起来看看 Promises 是什么以及如何使用它们写出更优雅的 JavaScript 代码. 您可能感兴趣的相关文章开发中可能会用到的几个 jQuery 提示和技巧精心挑选的优秀jQuery Ajax分页插件和教程推荐几款很好用的 JavaScript 文件上传插件精心挑选的优秀 jQuery 文本特效插件和教程精心挑选12款优秀 jQ…

编写更加稳定/可读的javascript代码

每个人都有自己的编程风格,也无可避免的要去感受别人的编程风格--修改别人的代码."修改别人的代码"对于我们来说的一件很痛苦的事情.因为有些代码并不是那么容易阅读.可维护的,让另一个人来修改别人的代码,或许最终只会修改一个变量,调整一个函数的调用时机,却需要花上1个小时甚至更多的时间来阅读.缕清别人的代码.本文一步步带你重构一段获取位置的"组件"--提升你的javascript代码的可读性和稳定性. 本文内容如下: 分离你的javascript代码函数不应该过分依赖…

深入理解JavaScript系列（1）：编写高质量JavaScript代码的基本要点

深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点 2011-12-28 23:00 by 汤姆大叔, 139489 阅读, 119 评论, 收藏, 编辑才华横溢的Stoyan Stefanov,在他写的由O'Reilly初版的新书<JavaScript Patterns>(JavaScript模式)中,我想要是为我们的读者贡献其摘要,那会是件很美妙的事情.具体一点就是编写高质量JavaScript的一些要素,例如避免全局变量,使用单变量声明,在循环中预缓存…

从setTimeout谈JavaScript运行机制

从setTimeout说起众所周知,JavaScript是单线程的编程,什么是单线程,就是说同一时间JavaScript只能执行一段代码,如果这段代码要执行很长时间,那么之后的代码只能尽情地等待它执行完才能有机会执行,不像人一样,人是多线程的,所以你可以一边观看某岛国动作片,一边尽情挥洒汗水.JavaScript单线程机制也是迫不得已,假设有多个线程,同时修改某个dom元素,那么到底是听哪个线程的呢? 既然已经明确JavaScript是单线程的语言,于是我们想方设法要想出JavaScript的…

浅谈JavaScript中的事件

引言 Html页面与JavaScript之间的交互是通过事件来完成的.事件,就是文档或者浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(处理程序)来预订事件,以便事件发生时执行相应的代码.这在传统的软件工程中称为观察者模式. 事件流事件流描述的是从页面中接收事件的顺序.但是IE团队和Netscape团队提出了完全相反的事件流概念.IE提出的是事件冒泡流,Netscape提出的是事件捕获流.下面我们就来详细介绍这方面的内容. 事件冒泡 IE的事件流是事件冒泡.即事件开始时由最具体的元素(文…

如何编写可维护的面向对象JavaScript代码

能够写出可维护的面向对象JavaScript代码不仅可以节约金钱,还能让你很受欢迎.不信?有可能你自己或者其他什么人有一天会回来重用你的代码.如果能尽量让这个经历不那么痛苦,就可以节省不少时间.地球人都知道,时间就是金钱.同样的,你也会因为帮某人省去了头疼的过程而获得他的偏爱.但是,在开始探索如何编写可维护的面向对象JavaScript代码之前,我们先来快速看看什么是面向对象.如果已经了解面向对象的概念了,就可以直接跳过下一节. 什么是面向对象? 面向对象编程主要通过代码代表现实世界中的实…

浅谈JavaScript中的闭包

浅谈JavaScript中的闭包在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: function compareByProperty(propertyName){ returnfunction(obj1,obj2){ return obj1[propertyName] - obj2[propertyName]; } } 该例中,compareByProperty内部的匿名函数有权利访问c…

高质量JavaScript代码书写基本要点

翻译-高质量JavaScript代码书写基本要点 by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1173 原文作者:Stoyan Stefanov原文链接:The Essentials of Writing High Quality JavaScript翻译编辑:张鑫旭 //zxx: 俗不可耐的开场白就免了,直接进入翻译内容(其实是因为本文是在太..太..长了,).…

谈JavaScript组合拼接字符串的效率 --转载

JavaScript组合拼接字符串的效率.在脚本开发过程中,经常会按照某个规则,组合拼接出一个大字符串进行输出.比如写脚本控件时控制整个控件的外观的HTML标签输出,比如AJAX里得到服务器端的回传值后动态分析创建HTML标签时,不过这里我就不讨论拼接字符串的具体应用了,我只是想在这里讨论一下拼接的效率. 字符串的拼接在我们写代码的时候都是用“+=”这个运算符,s += String; 这是我们最为熟知的写法,不知道大家有没有注意过没有,在组合的字符串容量有几十K甚至几百K的时候,脚本执行起来很…

2、.net NVelocity中原生javascript ajax封装使用

在页面上,我们经常会遇到局部刷新的例子,这个时候,就需要用到ajax, 因为很多代码都是公用的,所以我们想到了,将代码封装,简化了使用,减少了冗余 javascript ajax代码如下: var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); //创建XMLHTTP对象,考虑兼容性 xmlhttp.open("POST", "AJ…

如何管理你的 Javascript 代码

今天不聊技术的问题,咱们来聊聊在前端开发中如何管理好自己的 Javascript 代码.首先,咱们先来说说一般都有哪些管理方式?我相信 seajs . requirejs 对于前端开发者而言都不陌生,不错它们都是前端代码模块化开发的利器,显然以模块化的方式去管理我们的 Javascript 代码,是很不错的选择. 不过今天咱不谈模块化开发,因为上面的两个工具已经做得很好了,只要到他们的官方网站找到相应的文档资料,认真学习,不需太多时日你也能掌握模块化开发了.今天咱们要谈的是在不依赖模块管理工…

[转] 翻译-高质量JavaScript代码书写基本要点 ---张鑫旭

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1173 原文作者:Stoyan Stefanov原文链接:The Essentials of Writing High Quality JavaScript翻译编辑:张鑫旭 //zxx: 俗不可耐的开场白就免了,直接进入翻译内容(其实是因为本文是在太..太..长了,). 教程相关细节主题:JavaScript最佳实践难度…

高质量JavaScript代码书写基本要点学习

高质量JavaScript代码书写基本要点学习可维护的代码意味着: •可读的 •一致的 •可预测的 •看上去就像是同一个人写的 •已记录最小全局变量(Minimizing Globals) JavaScript通过函数管理作用域.在函数内部声明的变量只在这个函数内部,函数外面不可用.另一方面,全局变量就是在任何函数外面声明的或是未声明直接简单使用的. 每个JavaScript环境有一个全局对象,当你在任意的函数外面使用this的时候可以访问到.你创建的每一个全部变量都成了这个全局…

浅谈PHP代码设计结构

浅谈PHP代码设计结构您的评价: 还行收藏该经验 coding多年,各种代码日夜相伴,如何跟代码友好的相处,不光成为职业生涯的一种回应,也是编写者功力的直接显露. 如何看待程序和代码呢? 那就让我们从程序定义来谈起, 如果从业务最终呈现来看,一个程序可以看成是一个真实业务需求的逻辑代码映射. 如果从程序逻辑结构看,程序就是数据结构加算法的结合. 这样看,为满足更多的业务需求,更好的满足这些需求,就需要更多的程序代码, 当程序代码堆积达到一定数量后,如何管理好,整理好…

C#执行javascript代码

最近在做网站自动登陆小工具,遇到技术屏障.密码在submit时会使用js进行加密.这时我需要模拟这个加密过程,想到使用C#执行javascript代码. 对于执行javascript代码,纯代码方式使用如下两种方式. 1.Google Chrome V8引擎 Google Chrome V8引擎在.NET上的封装,功能完善,性能相对较高.地址: http://javascriptdotnet.codeplex.com/ using Noesis.Javascript; using System;…

由闭包引起的对javascript代码可维护性的思考

在最近的编程实践中由闭包的使用引起了我对javascript代码可维护性的思考.面向对象的其中一个特性封装性通过封装可以降低类与类之间或模块与模块之间耦合性从而使我们的设计更加高内聚低耦合,在大规模的程序开发中这是度量程序可维护性的一个指标,在大量应用了基于javascript的RIA的项目中javascript代码的可维护性也变得越来越值得我们去关注.因为在javascript中没有类的概念,所以我通常会借用闭包来将数据和操作这些数据的方法封装在一起来解决设计中对象的高内聚和对象之间的松耦合的…