速读《Javascript模式》(二)(js书写规范、命名规范)

|emmmm....今天翻了翻书,发现书是12年写的,版本可能比较旧,很多es6已经实现的东西这本书还是用比较旧的版本,但是没有关系,还是展示出来吧。


|其实按我的理解,这本书应该是一套通用的大家都来遵循的模板,让代码更加的美观和规范。


|碎碎念,让我们入正题吧,今天是第二章的内容,是一些代码编写的基本规范,比如变量名的命名规范等等。




一、尽量少用全局变量

这个上次有写到,虽然上次写的有点乱。。
全局变量的问题在于他们在整个Javascript应用或web页面内共享。他们生存在同一个全局命名空间内,总有可能发生命名冲突。譬如当一个应用程序中的两个独立的部分定义了同名的全局变量,但却有不同的目的时。

最小化全局变量数量的方法有 命名空间模式 或 立即执行函数。但最重要的还是var单一化。

其中最需要提防的是js的隐式创建全局变量。

详细看(一),我就不再赘述啦。


二、每个函数仅使用一个var声明

	function func(){
            var a = 1,
                b = 2,
                sum = a + b,
                myObject = {},
                i,
                j;

                //函数体 
        }


形如上面这种模式,是最猴的!


三、for循环

	myArray = [];
        for (var i = 0; i < myArray.length; i++) {
            //myArray[i]进行处理
        }

转化成

	myArray = [];
        var i,
            max = myArray.length;
        for (var i = 0; i < max; i++) {
            //myArray[i]进行处理
        }

遵循单一var原则,并且在这种方式下,对长度的值只提取一次,但应用到整个循环中。


四、for-in循环

*推荐使用正常的for循环来处理数组,并使用for-in循环来处理对象


        // 对象
        var man = {
            hands:2,
            leg:2
        }
        if(typeof Object.prototype.clone === "undefined"){
            Object.prototype.clone = function(){};
        }

该原型链是活动的,这也就意味着所有对象都会自动获取针对新方法的访问。为了避免在枚举man的方法时枚举出clone()方法,需要调用hasOwnProperty()函数来过滤掉该原型属性。

        var i,
            hasOwn = Object.prototype.hasOwnProperty;
            for(i in man){
                if(hasOwn.call(man, i)){
                    console.log(i, ":", man[i]);
                }
            }

因此,最好在for-in循环时加上一句hasOwnProperty()的判断


五、不要增加内置的原型

影响可维护性,不推荐


六、避免使用隐式类型转换

为了避免隐式类型转换导致的混淆不清,请在比较语句的时候使用===和!===


七、避免使用eval()

使用eval()可能包含一些安全隐患 不推荐使用

另外 setInterval()、setTimeout()、function()等构造函数来传递参数时,大部分情况下也会导致eval()的隐患

        //反模式
        setTimeout("myFunc()",100);
        setTimeout("myFunc(1, 2, 3)",1000);
        //推荐的模式
        setTimeout("myFunc",1000);
        setTimeout(function(){
            myFunc(1, 2, 3);
        },1000);



八、使用parseInt()的数值约定

使用parseInt()可以从一个字符串中获取数值,该函数的第二个参数是一个进制参数,最好不要忽略该参数

在es3中 以0开始的字符串会被认为是八进制数 但在es5中有变 为避免误会 最好传一个10

        var month = "06";
        month = parseInt(month, 10);

当然还有其他强制转换的方法

        +"08";
        Number("08");

但是不负责字符串哦


九、编码约定


(1)大括号

for、if循环时,一条语句的时候,也最好使用上大括号,避免以后要往里加东西,麻烦

(2)开放大括号的位置

由于js的分号插入性质

        function func(){
            return
            {
                name:"Bat"
            };
        }

会变成

        function func(){
           return undefined;
            {
                name:"Bat"
            };
        }

所以写成这样子吧

        function func(){
           return{
                name:"Bat"
            };
        }

(3)空格

  • 在分开for循环的各个部分的分号之后:
            for (var i = 0; i < 10; i += 1){}
  • 在for循环中初始多个变量
            for (var i = 0, max = 10; i < max; i += 1){}
  • 在限定数组项的逗号后
            var a = [1, 2, 3];
  • 对象属性的逗号之后和将属性名和属性值分开的冒号之后
            var o = {a: 1, b: 2};
  • 分隔开函数中各个参数的逗号之后
            myFunc(a, b, c);
  • 在函数声明的大括号之后
            function myFunc(){}
  • 在匿名表达式之后
            var myFunc =function () {};
  • 在函数中使用大括号开始之前,
  • 在大括号结束符和else或while之间
(4)命名约定


(5)编写API文档
        /**翻转一个字符串
        *@param{string}输入需要翻转的字符串
        *@return{string}翻转后的字符串
        */
        var reverse = function(input){
            //...
            return ouput;
        }




还有打包工具 Closure Compiler 以及检查工具 JSLint
还有打注释工具JSDoc ToolKit 和YUIDoc

ok 这就是所有第二章的内容啦 有什么不懂的小伙伴欢迎在评论区提出,这个笔记提炼出书的重要内容,有些东西面试常考到,本章主要讲了代码编写的一些需要遵循的规范,特别的变量命名那部分一定要用啊,我看过小伙伴写的不遵循小驼峰式的代码,太丑啦!所以一定要根据这个规范写代码,才专业嘛~


原文地址:https://www.cnblogs.com/suedar/p/8506326.html