文档章节

JavaScript学习笔记(Function类型)

lekabeen
 lekabeen
发布于 2017/09/10 17:21
字数 1092
阅读 1
收藏 0

ECMAScript中,函数就是对象,每个函数都是function类型的实例,并且具有属性和方法。为了理解这一概念,可从函数的定义方式入手。

function sum(num1, num2){
	return num1 + num2;
}

var sum = function(num1, num2){
	return num1 + num2;
}

var sum = new Function("num1","num2","return num1 + num2");  //不推荐使用

以上的三种方式都可以定义函数,前两种方式是常用的定义方式,第三种不推荐使用。但从第三种定义方式可看出,函数名就是一个引用类型的指针变量,函数就是一个对象。

既然函数名只是函数对象的指针,所以,一个函数可以有多个同时指向它的指针,即多个函数名。

 

function sum(num1, num2){
	return num1 + num2;
}
alert(sum(10,10));  //20

var anotherSum = sum;
alert(anotherSum(10,10));  //20

sum = null;
alert(anotherSum(10,10));  //20

1. 没有重载

ECMAScript中不存在函数重载,只会覆盖

var addSomeNumber = function(num){
	return num + 100;
};

addSomeNumber = function(num){
	return num + 200;
};

var result = addSomeNumber(100);  //300

既然函数名是指针,在重新赋值后自然重新指向新的内存空间

 

2. 函数声明和函数表达式

在之前所说的函数的三种定义方式中,以function开头的定义方式会被解析器最先初始化,以var开头的定义方式则不会

alert(sum(10,10));
function sum(num1, num2){
	return num1 + num2;
}
// 可以正常运行
alert(sum(10,10));
var sum = function(num1, num2){
	return num1 + num2;
}
// 运行期间产生报错

3. 作为值的函数

因为函数名本身就是变量,所以也可以作为值来使用,可以作为参数传递给另一个函数,也可以作为另一个函数的返回结果。

function callSomeFunction(someFunction, someArgument){
	return someFunction(someArgument);
}

function add10(num){
	return num + 10;
}

var result1 = callSomeFunction(add10,10);
alert(result1);  //20

function getGreeting(name){
	return "hello, " + name;
}

var result2 = callSomeFunction(getGreeting, "word");
alert(result2); //"hello, word"

以下代码根据函数可作为另一个函数的返回结果的特性,灵活地实现了对数组的自定义排序

function createComparisonFunction(propertyName){
	return function(object1, object2){
		var value1 = object1[propertyName];
		var value2 = object2[propertyName];
		
		if(value1 < value2){
			return -1;
		}else if(value1 > value2){
			return 1;
		}else{
			return 0;
		}
	}
}

var data = [{name:"zhangsan",age:28}, {name:"lisi", age:29}];

data.sort(createComparisonFunction("name"));
alert(data[0].name);  //lisi

data.sort(createComparisonFunction("age"));
alert(data[0].name);  //zhangsan

4. 内部属性arguments

arguments是函数对象中的一个属性,是一个类数组对象,包含着传入函数中的所有参数。

arguments有一个callee方法,可以调用拥有其arguments的函数,常用于做递归

function factorial(num){
	if(num <= 1){
		return 1;
	}else {
		return num * arguments.callee(num - 1);
	}
	//实现了求num的阶乘
}

alert(factorial(5));  //120

ECMAScript 5 规范了另一个函数对象的属性:caller,除了Opera早期版本,其他的浏览器都支持。这个属性中保存着调用当前函数的函数的引用,如果在全局作用域中调用当前函数,它的值为null

function outer(){
	inner();
}

function inner(){
	alert(arguments.callee.caller);
}

outer(); //outer函数的代码
inner(); //null

 

5. 内部属性this

this也是函数对象中的一个属性,引用的是函数的执行环境对象,设置类的属性和方法时需要通过this关来引用

window.color = "red";

function Circle(color){
	this.color = color;
}

function sayColor(){
	alert(this.color);
}

sayColor();  //"red"

var o = new Circle("blue");
o.sayColor = sayColor;
o.sayColor();  //"blue";

6. 函数属性prototype和length

函数的prototype属性是指向其原型的引用,JavaScript通过prototype属性实现了许多面向对象的功能

length是函数希望接收的参数个数

function sayName(name){
	alert(name);
}

function sum(num1,num2){
	return num1 + num2;
}
function sayHi(){
	alert("hi");
}

alert(sayName.length);  //1
alert(sum.length);  //2
alert(sayHi.length);  //0

7. 函数方法call、apply和bind

call()方法和apply()方法的作用相同,区别在于接收的参数不同

function sum(num1, num2){
	return num1 + num2;
}

function callSum(num1, num2){
	return sum.call(this,num1,num2);
}

function applySum(num1, num2){
	return sum.apply(this,[num1,num2]);
}
alert(callSum(10,10));  //20
alert(applySum(20,20));  //40

更重要的是,call()方法和apply()方法可以扩充函数的作用域,与prototype组合使用可以实现继承

window.color = "red";
var o = {color: "blue"};

function sayColor(){
	alert(this.color);
}

sayColor();

sayColor.call(this);  //red
sayColor.call(window); //red
sayColor.call(o);  //blue

ECMAScript 5 定义了一个方法:bind(),这个方法会创建一个函数实例,其this值会被绑定到穿个bind()函数的值

支持的浏览器:IE9+、Firefox 4+、Safari 5.1+、Opera 12+和Chrome

window.color = "red";
var o = {color: "blue"};

function sayColor(){
	alert(this.color);
}

var objectSayColor = sayColor.bind(o);
objectSayColor();  //blue

 

 

参考文献:    JavaScript高级程序设计(第3版)

© 著作权归作者所有

共有 人打赏支持
lekabeen
粉丝 0
博文 3
码字总数 3679
作品 0
厦门
程序员
《JavaScript权威指南》笔记(二)

第二篇笔记的内容主要涉及:数据类型转换,函数、对象、数组的创建以及null与undefined的比较。 1. javascript中类型转换的方法: (1)数字-->字符串: number+" "; String(number); number...

小微
2012/08/28
0
7
JavaWeb01-HTML篇笔记(七)

.1 案例三:完成对注册页面的数据的简单校验.1.1.1 需求: 对注册页面的数据进行非空的简单校验!!!如果有某个值没有输入,点击提交,弹出一个对话框进行提示!! 1.1.2 分析:1.1.2.1 技术分...

我是小谷粒
04/28
0
0
js的array实现栈数据结构

申明:本文是js系列笔记之一,有不正确的地方请尽管指出,大家相互学习,共同进步; 首先在阅读本文之前,默认你已经知道了javascript的数组类型,并且了解array的pop()和push方法;这里对这...

XBGG
07/03
0
0
读《JavaScript高级程序设计》

1、JavaScript学习笔记1:JavaScript学前介绍 http://my.oschina.net/bluefly/blog/478575 2、JavaScript学习笔记2:JavaScript基本概念 http://my.oschina.net/bluefly/blog/484445......

slyso
2015/07/14
0
0
JSON,异步加载(学习笔记)

JSON是一种传输数据的格式(以对象为样板,本质上就是对象,但用途有区别,对象就是本地用的,json是用来数据传输的,前端与后端的数据通信) JSON是静态类(不需要构造),类似于Math,内部...

Mrs_CoCo
04/23
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

python3.6 取整除法

python3.6 中取整除法运算逻辑如下: d 非零,那么商 q 满足这样的关系: a = qd + r ,且0 ≤ r n1=7//3#7 = 3*2 +1n2=-6.1//3#-7 = 3*(-3)+2'{},{}'.format(n1,n2) 从运行结果可以...

colinux
18分钟前
0
0
阶段总结——用虚拟机搭建一个高可用负载均衡集群架构

[toc] linux基本知识已经介绍完,现有一个业务需要操作,通过对这个项目的操作,可以复习、总结、巩固之前的知识点; ** 用13台虚拟机搭建一个高可用负载均衡集群架构出来,并运行三个站点,...

feng-01
21分钟前
0
0
mysql 设置utf8字符集 (CentOS)

1.查看数据库及mysql应用目前使用的编码方式 (1)链接mysql 客户端 (2)执行:status 结果: 2.修改mysql 应用的字符编码(server characterset ) (1)打开配置文件:vim /etc/mysql/my...

qimh
21分钟前
0
0
windows无法格式化u盘解决方法

1。点开始-运行-输入cmd-format f: /fs: fat32 (这里f:是指U盘所在盘符) 这个格式化会很慢 请耐心等待

大灰狼wow
33分钟前
0
0
MySql 8.0连接失败

原来,MySql 8.0.11 换了新的身份验证插件(caching_sha2_password), 原来的身份验证插件为(mysql_native_password)。而客户端工具Navicat Premium12 中找不到新的身份验证插件(caching_s...

放飞E梦想O
49分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部