一、尽量少用全局变量
   这是一个疑问最少,同时流传最 广的一条.Javascript使用函数管理作用域,全局变量最大的问题在于同名变量冲突.这种隐患产生比较直接的两个原因就是Javascript语言的特性造成的,即变量不用声明就可以直接使用以及变量不通过var直接使用则默认定义为全局变量.
 function fun(){
   var a=b=0; //a是局部变量,b是全局变量
  }

二、变量释放时是有副作用的 
  在Javascript中你可以通过delete操作将对象属性删除或者说撤销.使用var创建的全局变量不能通过delete删除,没有使用var的隐含式全局变量可以通过delete删除.如果这么说你不能理解,那么再进一步说隐含式的全局变量严格来讲不是真意义的全局变量,而是全局对象的属性,属性可以通过delete 删除,单变量不行。

 

三、全局变量的访问
  并不所有的情况下都能通过window对象访问到全局对象,如果它不叫window对象了,我们可以通过另一种方式取到全局对象:

var gloabl = (function(){
   return this;
  }());

一般来讲,this在函数内部作为一个函数调用时,往往指向全局对象.

四、单一var变量声明
  function fun(){
    var a = 1,
        b = 2,
        c = 3,
        d = {},
        e,
        f;
   }
这么做的好处在于:
(1)提供单一的地址以查找函数所需要的所有局部变量.
(2)在顶部声明,防止出现未声明就是用的错误逻辑.
(3)更少的编码,更直观显示定义好的变量.

五、变量的"提升"问题
  这类问题我经常在很多公司的面试题里看到,用来考察最作用域以及变量声明的理解.不过这里我们要看一点更实在的问题.
所谓的变量提升,这里提升的仅仅是声明.在Javascript中无论在哪里声明,效果都等同于在函数顶部声明,但是如果使用在声明之前可能会导致逻辑的错误.这里不得不举一个很常见的例子:
  name = "global";
  function fun(){
    alert(name);
    var name = "local";
    alert(name);
  }
  fun();
  // undefined
  // local

这里你要区分开声明和赋值是两个动作,被"提升"的仅仅是声明.

代码处理上分了两个阶段:
   第一阶段创建变量、函数声明以及形参.这是解析和进入上下文的阶段;
   第二个阶段是代码运行时,执行过程以及创建函数表达和不合格标识符;
所以在 ECMAScript其实没有"提升"的概念,这是一种表述.

六、for循环
  for (var i = 0,len=arr.length-1; i < len; i++) {
  };

每次循环不要总是重新计算集合总长,尤其是DOM元素集合时.另外一点是推荐逐步减到0的循环,即i--,因为同0比较要快于同数组长度比较.

七、循环的差异以及hasOwnProperty()
  在Javascript的一般使用上,for和for in可能没有结果上的不同,不过还是推荐遍历数组时使用for,如果遍历的是对象属性则使用for in.这里有一个小坑就是遍历对象属性来过滤遇到的原型链属性时,使用hasOwnProperty()方法是很重要的.

看看代码就明白我说的意思了:

 var obj = {
a:1,
b:2,
c:3
};
if(typeof Object.prototype.clone === "undefined"){
Object.prototype.clone = function(){
}
}
for(key in obj){
console.log(key);
}

这里输出的结果中会有clone,但其实很多时候我们是不想要原型链上的属性的,此时就可以通过hasOwnProperty()过滤掉原型链上的属性.

for(key in obj){
   if(obj.hasOwnProperty(key)){
    console.log(key);
   }
  }

八、不要增加内置的原型
   增加内置构造函数的原型是很有诱惑的,方便的同时也会带来维护以及协作上难以预知的风险.类似Object()或者Array()等都是不可取的.如果有类似的需要可以通过原型增加属性的方式实现,我经常做的就是为Array增加remove的function.

if (typeof Array.prototype.remove === "undefined") {
   Array.prototype.remove = function(){
   }
  };

九、勿忘JS隐式类型转换,尽量避免

  因为JS的弱类型特性,所以对于数据类型的确定并不规范.在使用比较语句时会执行隐式类型转换,所以当执行false==0或者""==0这种比较会返回true.所以当要进行比较的时候应该尽量使用===或者!===操作符来保证完全匹配.

十、不要省略parseInt()的参数
  parseInt()的第二个参数是一个进制参数,通常可以忽略,但是最好不要这样做.因为当解析的字符串是0开头的就会报错.而且ECMA3和ECMA5对此的处理标准还不一样,所以为了避免不可预知的问题,最好是加上禁止参数.

最后还有一些非常隐晦的坑,点出来只能通过大家自己注意了.编码规范,比如空格,缩进,大括号位置等,方法以及变量命名规则,这个只有等你后来维护代码的时候才会发现在没有完整注释以及文档的情况下,好的命名是多么重要.

Javascript日常编码中的一些常见问题的更多相关文章

  1. 大型 JavaScript 应用架构中的模式

    原文:Patterns For Large-Scale JavaScript Application Architecture by @Addy Osmani 今天我们要讨论大型 JavaScript ...

  2. [转]大型 JavaScript 应用架构中的模式

    目录 1.我是谁,以及我为什么写这个主题 2.可以用140个字概述这篇文章吗? 3.究竟什么是“大型”JavaScript应用程序? 4.让我们回顾一下当前的架构 5.想得长远一些 6.头脑风暴 7. ...

  3. JavaScript工作体系中不可或缺的函数

    一.函数的概念 日常生活中,我们要完成一件事,总是习惯先有一个计划,后期按照计划,一步一步执行,则能够完成,并且达到一定效果实现一定的功能.在编程的世界里,“功能”可称呼为“函数”,因此“函数”即一段 ...

  4. JavaScript日常学习2

    JavaScript 数据类型    字符串(String).数字(Number).布尔(Boolean).数组(Array).对象(Object).空(Null).未定义(Undefined). e ...

  5. JavaScript 字符编码

    JavaScript 字符编码 JavaScript 遵循 Unicode 字符编码规则.Unicode 字符集中每个字符使用 2 个字节来表示,这意味着用户可以使用中文来命名 Java)Script ...

  6. NC65在日常开发中常用的代码写法

    标题 NC65开发相关代码 版本 1.0.1 作者 walton 说明 收集NC在日常开发中常用的代码写法,示例展示 1.查询 1.1 通过BaseDAO查询结果集并转换 //通过BaseDAO进行查 ...

  7. JavaScript读取剪贴板中的表格生成图片

    原文 JavaScript读取剪贴板中的表格生成图片 演示地址 你可以访问下面的地址体验每个demo https://fairyever.github.io/excel-to-image-demo/ ...

  8. 编码中的Adapter,不仅是一种设计模式,更是一种架构理念与解决方案

    大家好,又见面了. 不知道下面这玩意大家有没有见过或者使用过?这是一个插座转换器.我们都知道日常使用的是220v的交流电,而国外不同国家使用的电流电压是不一样的(比如日本使用的是110v).且插座的接 ...

  9. JavaScript从数组中删除指定值元素的方法

    本文实例讲述了JavaScript从数组中删除指定值元素的方法.分享给大家供大家参考.具体分析如下: 下面的代码使用了两种方式删除数组的元素,第一种定义一个单独的函数,第二种为Array对象定义了一个 ...

随机推荐

  1. 优秀的gdb图形化前端调试器

    目前我自己最喜欢的还是 ddd . gdbgui 和 vim-vebugger插件或vimgdb插件 三种. You could try using Insight a graphical front ...

  2. mysql系列二、mysql内部执行过程

    向MySQL发送一个请求的时候,MySQL到底做了什么 客户端发送一条查询给服务器. 服务器先检查查询缓存,如果命中了缓存,则立刻返回存储在缓存中的结果.否则进入下一阶段. 服务器端进行SQL解析.预 ...

  3. tomcat jsp页面乱码解决

    浏览器接收服务器响应的中文参数: JSP页面中告诉浏览器使用什么编码: <%@ page language="java" contentType="text/htm ...

  4. route 的标志位

    linux下利用route命令查看当前路由信息时,会打印如下信息: root@root:/# route Kernel IP routing tableDestination     Gateway  ...

  5. nagios系列(六)之nagios实现对服务器cpu温度的监控

    1.安装硬件传感器监控软件sensors yum install -y lm_sensors* 2.运行sensors-detect进行传感器检测 ##一路回车即可 Do you want to ov ...

  6. CentOS 6.5自动化运维之基于DHCP和TFTP服务的PXE自动化安装centos操作系统详解

    前言    如果要给很多台客户端主机安装操作系统,要是每一台都拿张安装光盘一台一台主机的去装系统那就太浪费时间和精力了.在生产环境中也不实际,要实现为多台主机自动安装操作系统,那我们怎么实现自动化安装 ...

  7. 解决maven编译Java中的使用了未经检查或不安全的操作

    eclipse编译器找到右侧黄色点击可以定位到对应代码块位置 解决方法:鼠标悬浮在上方点击add即可 @SuppressWarnings("unchecked");给出的解决方案 ...

  8. 京东在html5页面中打开本地app的解决方案

    转:https://blog.csdn.net/CameloHuang/article/details/64476385 从html5打开本地的app–如果本地没有app就跳转到下载页面,大家都会认为 ...

  9. AlexNet

    AlexNet学习笔记 目录 AlexNet整体结构 CNN 全连接 TensorFlow实现 AlexNet是2012年ImageNet竞赛冠军获得者Hinton和他的学生Alex Krizhevs ...

  10. Hibernate的核心对象关系映射

    Hibernate的核心就是对象关系映射: 加载映射文件的两种方式: 第一种:<mapping resource="com/bie/lesson02/crud/po/employee. ...