前言

闲来看看javascript,在圆子里发现了汤姆大叔的文章,先是整体瞄了几眼,感觉不错,然后细细研读。记录下自己的学习历程和个人理解。更重要的是作为笔记


高质量JS代码

在看汤姆大叔的这一系列文章之前,写过js代码,但是没有多少理解(虽然现在也只是一个皮毛)。

最小全局变量规则

  • js的作用域是通过函数来进行控制。函数内部申明的变量是函数内部使用,函数外不可用。而全局变量是函数外部或函数内部未申明直接使用的。
  • 每个js环境都有一个全局对象即window,当你在任意函数外使用this都是指向他。更重要的是开发者创建的全部变量只是该对象的一个属性

全局变量的问题

  • 首当其冲的就是冲突,你的js程序和web页面上所有的代码都共享了这些全局变量,在同一全局命名空间不同部分相同全局变量名不同作用,产生冲突然后会让部分代码不能正常执行。
  • js隐含全局变量(个人认为这个最容易产生),js的两个特征造就了这一麻烦(个人观点);一是不需申明就可以使用变量,二是隐含全局概念,意味着你不申明的任何变量都会成为全局对象属性。隐式全局变量实例
  1. function mei(t,s){res=t+s;return res;},这个地方的res就是隐式全局变量。
  2. function mei(){var a=b=0; },此处a是本地变量,b则是全局变量。

减少全局变量的策略

  • 命名空间模式,
  • 函数立即自动执行,
  • 始终使用var来声明变量(这是最重要的)。

忘记var副作用

  • 采用var定义的全局变量是不能被删除,
  • 隐式全局变量是window的属性从而也就是可以被删除。

单var形式

  • 在函数首部采用单var定义变量,可以给一个整体的变量区域,方便查找
  • 防止变量在没用被声明之前使用,而带来不确定的bug(我觉得这个是最重要的)
  • 少代码
  • 减少隐式全局变量的产生(个人认为)

预解析:var散布的问题

  js在中,可以在函数中任何地方声明多个var变量,但是这跟你在函数的首部声明是一样的,这样就是hosting(悬置/置顶解析/预解析)。下面的这个例子可以很好的解释这一作用

  myName = "global";//这是全局变量

  function func(){

    alert(myName);//undefined

    var myName = "local";

    alert(myName);//local

  }

  第一个alert之处没有打印global而是打印的undefined,标志局部变量已经定义,而只是没有赋值(能打印undefined就表明局部变量已经覆盖全局变量)。

for与for-in

  for中主要强调在循环之前把长度先计算,避免在每次循环的时候进行长度的计算;还有就是页面dom的操作一般都是取得元素数组,如果在for中再进行实时计算,会花费大量的时间。

  for中还有就是i++,i--采用i=i+1,i=i-1进行替换,还用采用向下。

  for-in中主要讲解了hasOwnProperty对原型链的属性的过滤。

(不)扩展内置原型

  增加内置构造函数原型,挺诱人,但可能降低代码的维护性,更有可能让你的代码带来不可预测性;另外可能让你的代码在不使用hasOwnPorperty进行筛选,可能让原型属性暴露出来。


以下我是一些技巧和规范的问题

  •   多采用switch
  •   避免隐式转换,提倡采用===进行比较,===会先检查比较的两边的数据类型是否是一样,不一样就返回false。减少很多不必要的bug。以下一个实例:var zero=0;if(zero===false){"不执行"};if(zero==false){"执行"}。这种执行的情况产生了隐式转换,可能产生不必要或者是潜在的bug。
  • 避免eval();它接受任意的字符串当做js代码来执行。同样的setTimeout(),setInterval(),Function()构造函数传递字符串,要避免。(太随便的都是会有你想不到的)

写在最后

我写东西的初衷是记录我的学习历程,更重要的是作为笔记(强调);所以中间有错或者理解不对的地方,请大家指正。

我读汤姆大叔的深入理解js(一)的更多相关文章

  1. 我读汤姆大叔的深入理解js(二)

    继续汤姆大叔的js之旅. 揭秘命名函数表达式 函数表达式和函数声明 汤姆大叔在博客中引用ECMA规范:函数声明必须带有标识符,函数表达式可以省略.对于我来说这些概念的东西真是不所适从.还是大叔的实例带 ...

  2. 读汤姆大叔《深入理解javascript系列》笔记一编写高质量代码

    感觉大叔的博文真的是很不错 我打算严格要求自己 按照大叔说的,这样我就会更有规范,更有思想的去工作 去写代码(一入代码深似海)   1,尽可能的少用全局变量(污染全局空间,也会和别人的代码 发生冲突造 ...

  3. 汤姆大叔的6道js题目

    汤姆大叔的6道javascript编程题题解 看汤姆大叔的博文,其中有篇(猛戳这里)的最后有6道编程题,于是我也试试,大家都可以先试试. 1.找出数字数组中最大的元素(使用Math.max函数) 1 ...

  4. 读汤姆大叔《JavaScript变量对象》笔记

    一段简单的JavaScript代码思考 先看一段简单的代码,打印结果是??为什么why?? 从上述打印结果不难看出,在打印基本变量num.函数表达式fn.函数声明fun时,就已经知道变量num.函数表 ...

  5. 根本没有“JSON“对象这回事(读汤姆大叔博文记录)

    1.字面量 (1)他们是固定的值,不是变量,让你从“字面上”理解脚本. (2)字符串字面量是由双引号("")或单引号('')包围起来的零个或多个字符串组成的. (3)对象字面量是由 ...

  6. 学习汤姆大叔《深入理解JavaScript系列》有感(1) —— 立即调用的函数表达式

    一. 下面代码用于理解函数的声明和调用. function makeCounter() { // 只能在makeCounter内部访问i var i = 0; return function () { ...

  7. [转载]深入理解JavaScript系列 --汤姆大叔

    深入理解JavaScript系列文章,包括了原创,翻译,转载,整理等各类型文章,如果对你有用,请推荐支持一把,给大叔写作的动力. 深入理解JavaScript系列(1):编写高质量JavaScript ...

  8. 汤姆大叔 javascript 系列 第20课 最后的5到javascript题目

    博客链接:http://www.cnblogs.com/TomXu/archive/2012/02/10/2342098.html 原题: 大叔注:这些题目也是来自出这5个题目的人,当然如果你能答对4 ...

  9. 你必须知道ASP.NET知识------关于动态注册httpmodule(对不起汤姆大叔)

    一.关于动态注册的问题 很多人看过汤姆大叔的MVC之前的那点事儿系列(6):动态注册HttpModule ,其实汤姆大叔没有发现httpmodule动态注册的根本机制在哪里. 亦即:怎么动态注册?为什 ...

随机推荐

  1. AMap编辑折线、多边形、圆

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta http ...

  2. 【转】PL/SQL Developer各个窗口的功能

    源地址:http://www.codeweblog.com/pl-sql-developer%E5%90%84%E4%B8%AA%E7%AA%97%E5%8F%A3%E7%9A%84%E5%8A%9F ...

  3. C 指针疑虑

    uint16 *a; a=(uint16 *)b; 将变量b强制转换为Uint16类型的指针,然后赋值给Uint16类型的指针变量a. 如: uint8 WriteLpa(uint8 *buffer, ...

  4. [C#常用代码]类库中读取解决方案web.Config字符串

    对于类库里读取解决方案web.config文件里字符串的方法一.读取键值对的方法:1.添加引用using System.Configuration;2.web.Config配置节<appSett ...

  5. Java File.renameTo方法的问题

    今天发现一个问题,renameTo执行失败. 程序是这样的:一个小程序在执行完成时会将A目录的文件renameTo到B目录,该程序一直运行正常.今天将B目录进行了mount挂载(Linux上),挂载后 ...

  6. Python基础篇【第6篇】: Python装饰器

    装饰器 装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. 这种模式创建了一个装饰类, ...

  7. Javascript iframe交互并兼容各种浏览器的解决方案

    在Web前端开发中,我们经常会用到iframe这个控件. 但是这个控在内.外交互时,往往各个浏览器所用的关键字不同,很是麻烦,为了能够得到子iframe中的window对象,各家浏览器有着各家的指定, ...

  8. Balloons(山东省第一届ACM省赛)

    Balloons Time Limit: 1000ms   Memory limit: 65536K  有疑问?点这里^_^ 题目描述 Both Saya and Kudo like balloons ...

  9. Android Studio 修改字体

    修改字体(font)大小(size)   本文引用: http://blog.csdn.net/caroline_wendy/article/details/21876727   Android St ...

  10. 记录Castle ActiveRecord访问Sqlite的配置

    1.ActiveRecord配置文件ARConfig.xml,并将配置文件的“生成操作”改成“嵌入的资源” <?xml version=; i < ; i++)             { ...