zoukankan      html  css  js  c++  java
  • 读汤姆大叔《深入理解javascript系列》笔记一编写高质量代码

    感觉大叔的博文真的是很不错 我打算严格要求自己 按照大叔说的,这样我就会更有规范,更有思想的去工作 去写代码(一入代码深似海)
     
    1,尽可能的少用全局变量(污染全局空间,也会和别人的代码 发生冲突造成严重的后果) ---->命名空间模式或者是函数立即自动执行.
     
    2.不管是不是在函数内始终用var来声明变量, 例如:
    function sum(x, y){
     result = x + y;
    //这里创建了一个隐式全局变量
     return result;
    }
     
    3.避免出现隐式变量 例如在函数中不通过var声明的变量 或者是没有声明的变量. (部分var声明 例如)
    function foo(){
    var a = b = 0;
    //这里a是局部变量,但是b是全局变量
    }
    就好比   var a = (b = 0); 这行代码一样
    PS: 
    (1)通过var 创建的全局变量是不能被删除的;
    (2)无var创建的隐式全部变量 是可以被删除的 
    var  global_var1 = 1;
    global_var2 = 2;
    delete global_var1; //false
    delete global_var2;//true
    4.声明变量 不管是局部变量还是全局变量 使用链分配是比较好的做法  例如
    var a, b;  (变量的声明尽可能 var  和变量名字空开)--->
    5.函数中的变量的置顶解析/预解析 例如:
    function(){
    alert(name);//undefined 而不是报错是因为 咱们的name变量已经解析只是还没有进行表达式的赋值 所以他的值是有的 就是undefined
    var name = 'zero';
    }
    PS: 最好的办法就是你提前声明你需要的所有变量 并最数值确定的时候进行表达式赋值
     
    6.for循环
     
    for(var i = 0;i<myarray.length; i++){
    // do something  这不是一个好循环 (每次循环都要去读取myarray的长度 如果 myarray 是一个HTMLCollection对象的时候)
    // HTMLCollections指的是DOM方法返回的对象,例如:
    //document.getElementsByName()
    //document.getElementsByClassName()
    //document.getElementsByTagName()
    //每次查询都要实时查选dom (操作dom是比较昂贵的)
    }
    优化方案如下:
    (1)
    for (var i = 0, max = myarray.length; i < max; i++) {
       // 使用myarray[i]做点什么
    }
    (2)
    for (var i = 0, max = myarray.length; i < max; i+=1) {
       // 使用myarray[i]做点什么
    }
    (3)
    var i, myarray = [];
    for (i = myarray.length; i–-;) {
       // 使用myarray[i]做点什么
    }
     
    5. for-in 循环应该用在非数组对象的遍历上  也叫做"枚举"
     
    6. hasOwnProperty()方法---->过滤掉从原型链上下来的属性 例如:
      var man = {
       hands: 2,
       legs: 2,
       heads: 1
    };

    Object.prototype.name='zero';
    //console.log(man.name);//zero  在原型中添加了一个name属性并且赋值为zero
     
    for (var i in man) {
       if (man.hasOwnProperty(i)) { // 过滤
          console.log(i, ":", man[i]);
       }
    }
    控制台打印结果为 
    hands:2
    legs:2
    heads:1
    (已经把原型中添加的属性过滤掉了)
     
    另外一种使用hasOwnProperty()的形式是取消Object.prototype上的方法。像是:
     
    for (var i in man) {
       if (Object.prototype.hasOwnProperty.call(man, i)) { // 过滤
          console.log(i, ":", man[i]);
       }
    }
     
    其好处在于在man对象重新定义hasOwnProperty情况下避免命名冲突。也避免了长属性查找对象的所有方法,你可以使用局部变量“缓存”它。
     
    var i, hasOwn = Object.prototype.hasOwnProperty;
    for (i in man) {
        if (hasOwn.call(man, i)) { // 过滤
            console.log(i, ":", man[i]);
        }
    }
     
    PS: 不增加内置原型是最好的。
     
    7. 避免隐式类型转换-----> 始终使用===和!==操作符
     
    8.避免 eval(); 此方法接受任意的字符串,并当作JavaScript代码来处理 例如:
    // 反面示例
    var property = "name";
    alert(eval("obj." + property));

    // 更好的
    var property = "name";
    alert(obj[property]);
     
    9. 不要给setInterval(), setTimeout()和Function()构造函数传递字符串----->请传递函数
     
    // 反面示例
    setTimeout("myFunc()", 1000);
    setTimeout("myFunc(1, 2, 3)", 1000);

    // 更好的
    setTimeout(myFunc, 1000);
    setTimeout(function () {
       myFunc(1, 2, 3);
    }, 1000);
     
    使用function来代替eval是不错的选择
     
    var jsstring = "var un = 1; console.log(un);";
    eval(jsstring); // logs "1"

    jsstring = "var deux = 2; console.log(deux);";
    new Function(jsstring)(); // logs "2"

    jsstring = "var trois = 3; console.log(trois);";
    (function () {
       eval(jsstring);
    }()); // logs "3"

    console.log(typeof un); // number
    console.log(typeof deux); // "undefined"
    console.log(typeof trois); // "undefined"
    如果你绝对必须使用eval(),你 可以考虑使用new Function()代替。有一个小的潜在好处,因为在新Function()中作代码评估是在局部函数作用域中运行
    eval()和Function构造不同的是eval()可以干扰作用域链,而Function()更安分守己些 例如:
     
    (function () {
       var local = 1;
       eval("local = 3; console.log(local)"); // logs "3"
       console.log(local); // logs "3"
    }());

    (function () {
       var local = 1;
       Function("console.log(typeof local);")(); // logs undefined
    }());
     
    10.parseInt()下的数值转换 该方法接受另一个基数参数,这经常省略,但不应该---->  为了避免矛盾和意外的结果,总是指定基数参数
     
    11.parseInt() 替换方法是将字符串转换成数字,包括:
    +"08" // 结果是 8
    Number("08") // 8
     
    12.代码一定要进行缩进具体缩进多少 一个tab? 两个tab? 还是空格? 要根据团队的规范来执行
     
    13.花括号一定不要省略就算你的花括号中只有一条语句 ----->  始终把在与之前的语句放在同一行:
     
    function func() {
       return {
          name : "Batman"
       };
    }
     
    14.空格的使用
     
    var d = 0,
        a = b + 1;
    if (a && b && c) {
        d = a % c;
        a += d;
    }
     
    15.大写字母写构造函数:
    var adam = new Person(); 
     
    16. 构造函数--> 驼峰(Camel)命名法:
    MyConstructor()
    17.对于函数和方法名称,变量也可以使用小驼峰式命名法
    calculateArea()getFirstName()
     
    18. 全部单词大写;
    var PI = 3.14,
     
    19. 使用一个下划线前缀来表示一个私有属性或方法会更容易些
    20.你要随时注释你的代码我相信一个良好的程序员都会在每个功能模块加上自己的注释 不为了别人 为了自己也需要
     
  • 相关阅读:
    AGC034F
    loj6074
    杂题
    ICPC2020南京
    CF1326F2
    Codeforces Round #692 Div1
    CF1463F
    SRM582 SemiPerfectPower
    10月30日考试 题解(质数+最小生成树+模拟+DP优化)
    10月28日考试 题解(贪心+二分+树形DP+期望+线段树)
  • 原文地址:https://www.cnblogs.com/ling-du/p/4832969.html
Copyright © 2011-2022 走看看