如何编写高质量JS代码(续)

函数给程序员提供了主要的抽象功能,又提供实现机制。函数可以独立实现其他语言中的多个不同的特性,例如,过程、方法、构造函数,甚至类或模块。

2.1 理解函数调用、方法调用以及构造函数调用之间的不同

针对面向对象编程,函数、方法和类的构造函数是三种不同的概念。

使用模式:

1,函数调用

复制代码 代码如下:


function hello(username){
    return "hello" + username;
}

2,方法调用

复制代码 代码如下:


var obj = {
    hello : function(){
        return "hello , " + this.username;
    },
    username : "floraLam"
};
ohj.hello();//"hello ,  floraLam"

this变量被绑定到对象是由于hello方法被定义在obj对象中,我们也可以子啊另外一个对象中赋值一份相同的函数引用,并得到相同的答案。

复制代码 代码如下:


var obj2 = {
    hello : obj.hello(),
    username : "floraLam"
};


3,构造函数使用

复制代码 代码如下:


function User(name,passwordHash){
    this.name = name;
    this.passwordHash = passwordHash;
}

使用new操作符来调用User则视为构造函数。

复制代码 代码如下:


var u  = new User("floraLam","123");

与函数调用和方法调用不同的是,构造函数调用将一个全新的对象作为this变量的值,并隐式返回这个新对象作为调用结果。构造函数的主要职责是初始化该新对象。

2.2 熟练掌握高阶函数

高阶函数无非是那些将函数作为参数或返回值的函数,将函数作为参数(通常称为回调函数,因为高阶函数"随后调用"它)是一种特别强大、富有表现力的惯用法,也在js程序中被大量使用。

考虑数组的标准sort方法,为了对所有数组都能工作,sort方法需要调用者决定如何比较数组中的任意两个元素。

复制代码 代码如下:


function compareNumber(x,y){
    if(x < y){
        return -1;
    }
    if(x > y){
        return 1;
    }
    return 0;
}
[3,1,4,1,5,9].sort(compareNumbers);//[1,1,3,4,5,9]

复制代码 代码如下:


[3,1,4,1,5,9].sort(function(x,y){
    if(x < y){
        return -1;
    }
    if(x > y){
        return 1;
    }
    return 0;
});//[1,1,3,4,5,9]

上述例子使用一个匿名函数进一步简化。

学会使用高阶函数通常可以简化代码并消除繁琐的样板代码。简单的转换字符串数组的操作我们可以使用循环这样实现:

复制代码 代码如下:


var names = ["Fred","Wilma","Pebbles"];
var upper = [];
for(var i = 0,n = names.length ;i< n;i++){
    upper[i] = names[i].toUpperCase();
}
upper;//["FRED","WILMA","PEBBLES"];

使用数组便利的map方法,可以消除循环,仅仅使用一个局部函数就可以对元素的逐个转换。

复制代码 代码如下:


var names = ["Fred","Wilma","Pebbles"];
var upper = names.map(function(name){
    return name.toUpperCase();
});
upper;//["FRED","WILMA","PEBBLES"];

另外,例如我们想创建若干个方法创建不同的字符串,具有共同的实现逻辑,每个循环通过连接每个独立部分的计算结果来创建一个字符串。

复制代码 代码如下:


 function bulidString(n,callback){
     var result = "";
     for(var i = 0 ; i < n ;i++){
         result += callback(i);
     }
     return  result;
 }
 var alphabet = bulidString(26,function(i){
     return String.fromCharCode(aIndex + i);
 });
 alphabet;//"abcdefghijklmnopqrxtuvwxyz";
 var digits = buildString(10,function(i){ return i;})
 digits;//"0123456789"
 var random = buildString(9,function(){
     random += String.fromCharCode(Math.floor(Math.random()*26)+aIndex
 });
 random;//"yefjmcef"(随机)

这样能够使得读者更清晰了解该代码能做什么,无须深入实现细节。

备注

   javascript返回指定范围的随机数(m-n之间)的公式:Math.random()*(n-m)+m

  同时要注意题目要求,是否要求返回正整数

2.3调用模式

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wjxwsw.html