`
lgx2351
  • 浏览: 171463 次
  • 性别: Icon_minigender_1
  • 来自: 福州
社区版块
存档分类
最新评论

js学习笔记2-函数

阅读更多

2. 函数
2.1函数直接量
函数直接量是用作表达式,而不是用作语句,它无需指定函数名。与函数写法的比较:

function f(){} 
var f = function(){}

 
2.2函数的参数
Js中函数的参数个数和类型是可以很任意的,这就需要用于实质的情况进行相应的判断处理。

可选参数

如果一个函数的参数是可选的,那么如果没有传的话,则是underfined的值,则在函数里用||对它进行赋默认值。这种写法很常用。

用对象来作为函数的参数

当函数的参数较长的用,且常与||一起使用。

参数类型

如果对函数的参数类型有着严格的要求,那么记得一定要在函数内对类型做判断,如果类型不正确,则抛出异常来报告这一事实。如arraycopy()方法,期望的参数是数组,则如果传入的不是数组,那么需要抛出。

再比如我们计算一个数组所有元素的和,如果是在以前,程序里是数组里预先是判定所有的元素都是数值的,然后根据数值的元素的情况去求和。但是,很多时候开发者并不是一个人,可能你要处理的数组是别人开个接口提供给你的,或者你是从数据库去取出数据来构造出数组,这时候你就不能都把元素当作数值来判断,必须对传入的是否是数组,及元素是否是数值进行相应的判断,如果元素有underfined或null时忽略,或元素包含有不是数值时给出提示,或传入的值不是数组时给出提示。具体的代码如下:

function ArrayUserCommMgr{}
ArrayUserCommMgr.prototype={
	isArray:function(a){
 		var result = false;
 		if((a instanceof Array)||(a && typeof a == "object" && "length" in a)){
			result = true;
		}
		return result;
 	},
	getSum:function(a){
		if (arrayUserCommMgr.isArray()){ 
			var total = 0;
			for(var i = 0; i < a.length; i++) {
				var element = a[i];
				if (!element) continue;  // ignore null and undefined elements
				if (typeof element == "number"){
					total += element;
				}else{
					throw new Error("sum(): all array elements must be numbers");
				}
			}	
		}else{
			throw new Error("sum(): argument must be an array");
		}	
	}	
}

 

以上代码注意的是:

1、用((a instanceof Array)||

           (a && typeof a == "object" && "length" in a))

来判断是否传入的是数组(instanceof Array),或类似数组的对象((a && typeof a == "object" && "length" in a))

2、元素如果是underfined或null,则不管,继续执行函数(continue)。

3、元素如果是数值,则相加。数值用:

typeof element == "number"

4、元素如果含有非数值,则提示出来(throw new Error(“”))。

以下函数对于传入的参数进行求和,它把所有的类型情况都考虑到了,好好理解:

function flexisum(){
    var total = 0;
    for(var i=0;i<arguments.length;i++){
       var element = arguments[i];
       if(!element) continue;
       var n;
       switch(typeof element){
           case "number":
              n = element;
              break;
           case "object":
              if(element instanceof Array){
                  n = flexisum.apply(this,element);
              }else{
                  n = element.valueOf();
              }
              break;
           case "function":
              n = element();
              break;
           case "String":
              n = parseFloat(element);
              break;
           case "Boolean":
              n = NaN;
              break;
       }
    }
    if((typeof n == "number")&&(!isNaN(n))){
       total += n;
    }else{
       throw new Exception("无法转换元素"+element);
    }
    return total;
}

 

函数的参数里内在的Arguments对象

1、  arguments对象是函数内在的对象,arguments是一个标识符。

2、  arguments对象是一个类似于数组的对象(类似于数组指的是首先是一个object,然后它具有length属性),它是通过数目,而不是通过名字(说明取得arguments的值只能通过索引来取,不能通过名字来取,因为参数的名字可以随便取的,所以无法取得参数的名字,其实取名字也没有什么意义)来取值。

3、  arguments对象有什么用?一是用来检测调用函数所传入的参数是否是定义要求的个数。如果不是,则抛出异常,这对于对调用传入参数个数有严格要求的情况很有用,如:

function f(a,b,c){
if(arguments.length>3)
        throw new Error(“对不起!传入的参数个数有误!”);
}

 

二是可以传入任意的参数的情况还对参数进行操作,如传入若干个参数,得到所有传入的参数的总和,用for循环即可了,如前面的求和函数flexisum()。这时,这种函数我们叫它可变参数函数(注意:可变参数函数不允许通过0参数方式来调用)。

4、  对arguments对象的赋值也会影响到参数的值。

5、  对arguments对象的操作除了处理它的元素外,它有一个callee属性比较常用,它引用的是正在执行的函数。一般用它来对未命名的函数递归地调用自己。如以下计算阶乘:

function(x){
	return x * arguments.callee(x-1);
}

2.3把函数做为数据
1、把函数用做数据的写法其实在程序里很常用,可且用得很多,需要较为好的熟悉。

2、有时候,我们写函数并不需要用到这个函数的函数名,这时候把它作为数据赋值给其它变量,也会执行这个函数,这时候就不需要函数名了。

3、把函数作为数据,可以把它函数赋值给一个变量,可以把它做为一个对象的属性(这点在写ptototype里常用),可以把它放在数组里,可以把它做为参数传递给一个函数等等。总之,可以把它做为数据来使用。如:

把函数传给变量:

Var a = function(x){x*x}

把函数做为对象的属性:

Var o = new object();

o.square = function(x){x*x}

把函数放在数组里:

Var a = new Array(10);

A[0] = function(){}

1、  以下是一个较为完整的例子,好好理解(学习写法):

function add(x,y) { return x + y; }
function subtract(x,y) { return x - y; }
function multiply(x,y) { return x * y; }
function divide(x,y) { return x / y; }

function operate(operator, operand1, operand2)
{
    return operator(operand1, operand2);
}

var i = operate(add, operate(add, 2, 3), operate(multiply, 4, 5));

//以下是另一种写法
var operators = {
    add:      function(x,y) { return x+y; },
    subtract: function(x,y) { return x-y; },
    multiply: function(x,y) { return x*y; },
    divide:   function(x,y) { return x/y; }
};
function operate2(op_name, operand1, operand2)
{
    if (typeof operators[op_name] == "function")
        return operators[op_name](operand1, operand2);
    else throw "unknown operator";
}
var j = operate2("add", "hello", operate2("add", " ", "world"))

 

以上代码可以学习的有很多:

1、  把一些相关的操作组合在一起,用对象来组合。要调用哪个函数时传入这个对象的标识就可以了。(但是感觉有些麻烦了)

2、  如果要调用一个函数,而这个函数用数据的方式来写。可以先判断typeof是否是funciton,是的话,用对象的标识来得到函数,再传入数据来调用:

    if (typeof operators[op_name] == "function")
        return operators[op_name](operand1, operand2);
    else throw "unknown operator";

  

3、  前面一段是用传统的写法,用函数名。后面是把函数当作数据的写法。前面的写法里也可以把参数名做为参数传到函数里去:

function operate(operator, operand1, operand2)
{
    return operator(operand1, operand2);
}

2.4把函数作为方法
定义一个函数,并把它作为方法来引用,这种写法很常用。
或者,把一个函数作为一个对象的属性,然后调用这个对象的方法,如:
var o.m = f;
o.m();
把函数作为方法来调用要有一个属性很重要,它是this。在一个方法体内,this指的是用来调用这个方法的对象。
当一个函数作为方法来被调用时,记得其实隐藏的传递一了一个参数,即调用函数的对象。
2.5构造函数
构造函数的定义是:是初始化对象的属性并且和new一起来使用的一个函数。当new 它时,是创建了一个object,且这个new的object之后可以用this来传递。
2.6函数的属性与方法
prototype

函数最重要的且最常用的属性是原型prototype:
每个函数都有prototype属性,它引用的是预定义的原型对象。这个原型对象在new一个object时起作用,也就是当你 new调用一个构造函数时起作用。这个原型对象在你定义自己的对象类时也常用,也起到了很重要的作用。
length
函数也有length属性,只是我们比较少用,它指的是这个函数在定义是所指定的参数的个数,而不是像arguments的length一样指的是实质传入函数的参数的个数。因此,我们可以写个函数,用来指定传入的参数个数是否是指定的,从而对那些对参数个数有严格要求的函数的调用进行控制:

function check(){
 var expectedNum = arguments.callee.length;
 var actedNum = arguments.length;
 if(parseInt(expectedNum)!=parseInt(actedNum)){
  throw new Error(”调用的参数与函数定义时期望的参数个数不符合!”);
 }
}

 
注意上面是用arguments的callee属性来引用自身(因为在函数体内其它的方法无法指定函数本身)。
定义自己的函数属性
这里的“定义自己的函数属性”指的是:有时你想用一个全局变量时,而这个全局变量只在某个函数体内使用,并没有在其它的函数体内被使用。这时候,可以考虑把它定义为这个函数的属性并当作全局变量来使用,如下:

f.counter = 0;
function f(){
 return f.counter++;
}

 
在上面的代码中把counter不作为全局变量,而作为f的属性,在f的函数体内用f.counter来引用这个变量,它也起到了全局变量的效果,可以保存之前变化的值。
方法apply()和call()(apply和call较难理解,可参看收藏的相关内容)
1、 使用这两个函数可以像调用其它对象的方法一样来调用函数。
2、 第一个参数是要调用的函数的对象,在函数体内这一参数是this的值(不太理解)
3、 其它的参数是参数值。Apply与call一样,只不过传递的参数是数组。
如:
f.call(o,1,2)相当于:
o.m = f;
o.m(1,2);
delete o.m;
又如:
Var maxNum = Math.max.apply(null,array_of_num);

分享到:
评论
2 楼 lgx2351 2009-09-03  
wtusmchen 写道
blog写的不错啊,以后多过来学习:)

多谢wtusmchen大哥的鼓励!只是一些总结,望多多指教!
1 楼 wtusmchen 2009-09-03  
blog写的不错啊,以后多过来学习:)

相关推荐

    JavaScript学习笔记_js常用函数封装_js包.zip

    JavaScript学习笔记_js常用函数封装_js包 gulp scss 模块化开发 github常用命令

    前端学习(四)——javascript学习笔记(二)函数

    前端学习——javascript学习笔记(二)函数

    jquery学习笔记及常用函数封装.zip

    jquery学习笔记及常用函数封装 JQuery1.10.1 jquery-ui.min.js 从JQuery入门 -&gt; 进阶 -&gt; 实战

    JS学习笔记相关代码-测试代码

    JS学习笔记相关文档 Login.html学习 placeholder 属性规定可描述输入字段预期值的简短的提示信息(比如:一个样本值或者预期格式的短描述)。 该提示会在用户输入值之前显示在输入字段中。 注意:placeholder 属性...

    javascript学习笔记发放2

    javascript学习笔记发放2。这章我们 继续.然后了解下js中操作数据 和 函数的 作用域。

    js学习笔记大全

    为减少 js 关键词的占用,此文件只占用“c$”一个关键词; * 使用时用: c$.函数名(参数列表); 或者 c$().函数名(参数列表) * 字符串操作函数、日期操作函数、数组操作函数等,直接增加到 String、Date、Array 类里面,...

    holemar学习笔记(2011-12-21)

    这是本人多年积累的学习笔记,记录详细、内容宽广,对新手高手都会有所帮助 作者: 冯万里(Holemar) 邮箱: daillow@gmail.com QQ: 292598441 MSN: daillo@live.cn 更新日期: 2011-12-21 文档都可以用文本编辑器...

    JavaScript学习笔记之JS函数

    函数就是包裹在花括号中的代码块,前面使用了关键词function: 复制代码 代码如下: function functionName() {  这里是要执行的代码 } 函数参数  函数的参数可以任意多个,不用声明变量类型,只用给出变量名: ...

    JavaScript学习笔记之惰性函数示例详解

    函数是js世界的一等公民,js的动态性、易变性在函数的应用上,体现的淋漓尽致。下面这篇文章主要给大家介绍了关于JavaScript学习笔记之惰性函数的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下。

    javascript学习笔记.docx

    共70页,复制两页供参考,如下: 1 JavaScript基本语法 1) 读未声明的变量会产生...但JavaScript默认的函数和构造函数会在每个窗口中拥有独立副本。 16) onload()和onunload()事件分别在网页装载完成后和卸载前执行。

    ExtJS4中文教程2 开发笔记 chm

    ExtJS4学习笔记(七)---带搜索的Grid(SearchGrid) ExtJS4学习笔记(三)---VBox的使用 ExtJS4学习笔记(九)---ExtJS4 EditGrid(可编辑的Grid) ExtJS4学习笔记(二)---HBox的使用 ExtJS4学习笔记(五)---Grid分页 ExtJS4...

    JavaScript-学习笔记.docx

    自己学习笔记。视频:腾讯课堂:渡一教育 内容大纲: 预编译: 函数 闭包问题 对象 原型、原型链、call、apply 继承模式 对象克隆 数组 类数组 数组去重 自定义type方法(类似于typeof) try-catch es5.0严格模式 ...

    JavaScript学习笔记讲解

    1.2.1 也可将javascript放入到单独的一个文件js文件,在需要使用的时候引入: 2 1.2.2 在超连接中使用javascript 3 1.2.3 在button中也可使用javascript 3 1.3 JAVASCRIPT的保留关键字 3 1.4 JAVASCRIPT的基本语法 3 ...

    javascript学习笔记(七) js函数介绍

    javascript学习笔记之js函数介绍,需要的朋友可以参考下

    Javascript学习笔记4 Eval函数

    eval的作用其实很简单,就是把一段字符串传递给JS解释器,由Javascript解释器将这段字符串解释成Javascript代码,并且执行他。 举个最简单的例子: 代码如下: [removed] eval&#40;“alert(1+1&#41;”); [removed] 很...

    整理Javascript函数学习笔记

    1、什么是函数 如果需要多次使用同一段代码,可以把它们封装成一个函数。函数(function)就是一组允许在你的代码里随时调用的语句。每个函数实际上是一个短小的脚本。 如:要完成多组数和的功能。 var sum; sum = ...

    JavaScript学习笔记(三):JavaScript也有入口Main函数

    而在JavaScript中,程序是从JS源文件的头部开始运行的。但是某种意义上,我们仍然可以虚构出一个main函数来作为程序的起点,这样一来不仅可以跟其他语言统一了,而且说不定你会对JS有更深的理解。 1. 实际的入口 当...

    Javascript学习笔记2 函数

    但是当我们对其中的函数进行修改时,会发现很奇怪的问题。 代码如下: [removed] function Hello() { alert&#40;“Hello”&#41;; } Hello(); function Hello() { alert&#40;“Hello World”&#41;; } Hello(); &lt;/

Global site tag (gtag.js) - Google Analytics