javascript第二弹——函数
什么是函数
函数是一块javascript代码,被定义一次,就可以执行和调用多次;函数也是js对象,所以也可以像对象那样操作和传递;所以我们也把函数称之为函数对象;
创建函数的几种方法
一、函数声明
function a(){
//代码
}
二、函数表达式
1、自调用函数(立即执行)
(function(){
//代码
})();
2、 匿名函数表达式(将函数赋值给变量)
var a = function(){
//代码
}
3、作为返回对象
return function(){
//代码
}
三、函数构造器(不常用)
var fun = new Function();
var fun = Function();
// 这两种方法等价
函数的调用方法
1、直接调用
fun();
2、作为对象方法调用
obj.fun();
3、作为构造函数调用
new fun();
4、call/apply/bind(未开发)
func.call();
函数声明和函数表达式的区别
函数声明会被前置
function a(){};<-------| //相当于函数声明提前了
a(); //1 |
function a(){--------->|
var b = 1;
console.log(b);
};
函数表达式的变量会被提前
var a;<-----------------------------------------| //变量被前置 值为undefined
a(); //TypeError: a is not a function |
var a = function(){---------------------------->|
var b = 1;
console.log(b);
}
函数的参数是什么
函数的参数是用一个数组来表示的,可以在函数内部通过arguments对象来访问,但是arguments不是一个Array实例;
形参和实参
function person(name,age){ //name,age为形参
return '名字:'+name+'年龄:'+age;
}
person('wyang',26); //实参
如上面代码中的name
,age
没有具体的值的,但是可以在函数体内进行一系列逻辑处理的参数就是形参,再调用函数时传入的参数如上面代码中的wyang
,26
是实实在在存在值的就是实参;
函数传参
通过值传递参数
在函数中调用的参数是函数的参数。
如果函数修改参数的值,将不会修改参数的初始值(在函数外定义)。
函数参数的改变不会影响函数外部的变量(局部变量)。
通过对象传递参数
在JavaScript中,可以引用对象的值。
因此我们在函数内部修改对象的属性就会修改其初始的值。
修改对象属性可作用于函数外部(全局变量)。
this
全局中的
this
指向的是window
,函数内的this
也是指向window
;
对象方法中的this指向该方法。
函数对象赋值给对象属性的时候,this指向的是该对象
var obj = {
name:'wyang'
}
function person(){
return this.name;
}
obj.sayNma = person;
obj.person(); //wyang
对象原型链上的this
var obj = {
sayPro:function(){
return '名字:'+this.name+'年龄:'+this.age;
}
}
var o = Object.create(obj);
o.name = 'wyang';
o.age = 26;
console.log(o.sayPro()); //名字:wyang年龄:26
回调函数
一、在理解回调函数之前先理解下javascript里面call()
这个方法;
语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
参数
thisObj
可选项。将被用作当前对象的对象。
arg1, arg2, , argN
可选项。将被传递方法参数序列。
说明
call
方法可以用来代替另一个对象调用一个方法。call
方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj
指定的新对象。
如果没有提供 thisObj
参数,那么 Global
对象被用作 thisObj
。
上面的一堆我们用代码来简单梳理下:
function person(){
var name = 'wyang';
var age = 26;
console.log(name+','+age);
}
function one(){
var name = 'wangyang';
var age = 27;
console.log(name+','+age);
}
person.call(one); //wyang,26
上面的例子是person
把one
替换掉了。所以输出的就是wyang
和26
;
下面我们用call
方法做一个继承的例子。
function person(){
this.name = 'wyang';
this.age = 26;
}
function one(){
person.call(this);
console.log(this.name);
}
one(); //wyang,age
上面例子person
本身作为对象定义一个值为wyang
的属性name
;然后在one
函数里通过call
方法把person
的属性继承给自己。调用one
函数输出wyang
;
二、通过call
方法实现的回调函数
function person(callback){
console.log(name);
callback.call(this);
}
function one(){
var name = 'wyang';
console.log(name);
}
person(one); //wyang;wyang
上面例子中的person
定义一个形参为callback
;
通过call
方法把形参callback
替换掉自己;
函数one
中命名一个变量name
并设定值为wyang
;
然后调用person
函数,并把one
函数作为参数传进去。
可以看到输出两次wyang
;这说明在函数person
里面接收到了one
函数里面的name
变量的值;
而one
函数作为参数在person
函数内通过call
方法把person
替换掉,在调用person
函数的时候,one
函数也被成功调用,然后成功输出;
三、通过普通方式的回调
function person(callback){
console.log(name);
callback();
}
function one(){
var name = 'wyang';
console.log(name);
}
person(one); //wyang;wyang
上面例子中我们把call
方法去掉,直接在函数person
内部调用参数callback
;
然后把one
函数作为参数传递进去;
需要注意的是:javascript中的函数是对象,
one
作为一个函数名是对Function对象的引用,所以在person
函数内部调用callback
参数时,要加‘()’;不然传递的只是一个函数名而已,并不是函数对象本身;
javascript第二弹——函数的更多相关文章
- Javascript 基础--JS函数(三)
一.基本概念:未完成某一个功能的代码(语句,指令)的集合. 二.函数的调用方式: 2.1.函数名(传递参数1,传递参数2) 基本语法 function 函数名(参数列表){ //代码; retur ...
- 前端学习 第二弹: JavaScript中的一些函数与对象(1)
前端学习 第二弹: JavaScript中的一些函数与对象(1) 1.apply与call函数 每个函数都包含两个非继承而来的方法:apply()和call(). 他们的用途相同,都是在特定的作用域中 ...
- 前端学习 第六弹: javascript中的函数与闭包
前端学习 第六弹: javascript中的函数与闭包 当function里嵌套function时,内部的function可以访问外部function里的变量 function foo(x) { ...
- 深入理解javascript函数系列第二篇——函数参数
× 目录 [1]arguments [2]内部属性 [3]函数重载[4]参数传递 前面的话 javascript函数的参数与大多数其他语言的函数的参数有所不同.函数不介意传递进来多少个参数,也不在乎传 ...
- 青瓷引擎之纯JavaScript打造HTML5游戏第二弹——《跳跃的方块》Part 10(排行榜界面&界面管理)
继上一次介绍了<神奇的六边形>的完整游戏开发流程后(可点击这里查看),这次将为大家介绍另外一款魔性游戏<跳跃的方块>的完整开发流程. (点击图片可进入游戏体验) 因内容太多,为 ...
- JavaScript学习09 函数本质及Function对象深入探索
JavaScript学习09 函数本质及Function对象深入探索 在JavaScript中,函数function就是对象. JS中没有方法重载 在JavaScript中,没有方法(函数)重载的概念 ...
- JavaScript高级之函数的四种调用形式
主要内容 分析函数的四种调用形式 弄清楚函数中this的意义 明确构造函对象的过程 学会使用上下文调用函数 了解函数的调用过程有助于深入学习与分析JavaScript代码. 本文是JavaScript ...
- JavaScript高级程序设计--函数小记
执行环境和作用域链 每个函数都有自己的执行环境.当执行流进入一个函数时,函数 的环境就会被推入一个环境栈中.而在函数执行之后,栈将其环境弹出,把控制权返回给之前的执行环境. 当代码在一个环境中 ...
- Javascript中的函数(三)
一:概述 函数是进行模块化程序设计的基础,编写复杂的Ajax应用程序,必须对函数有更深入的了解.JavaScript中的函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的.通过函数对象的性质 ...
随机推荐
- PeopleEditor允许客户端输入的同时验证输入的内容
如何判断PeopleEditor的值为空 在sharepoint开发中,我们经常会用到PeopleEditor这一控件,最近我在写程序的时候用到了,开始的时候不知道怎么用,后来问题解决啦,现在写出 ...
- selenium启动Chrome时,加载用户配置文件
selenium启动Chrome时,加载用户配置文件 Selenium操作浏览器是不加载任何配置的,网上找了半天,关于Firefox加载配置的多点,Chrome资料很少,下面是关于加载Chrome ...
- mysql 我的学习
安装要求 安装环境:CentOS-6.3安装方式:源码编译安装 软件名称:mysql-cluster-gpl-7.2.6-linux2.6-x86_64.tar.gz下载地址:http://mysql ...
- Java for LeetCode 200 Number of Islands
Given a 2d grid map of '1's (land) and '0's (water), count the number of islands. An island is surro ...
- osg事件处理器osgGA::GUIEventHandler handle
bool handle(const osgGA::GUIEventAdapter& ea, osgGA::GUIActionAdapter& aa) { osgViewer::View ...
- VS 高亮显示不带后缀的C++头文件
工具-选项-文本编辑器-文件扩展名-勾选“将无扩展名文件映射到(M)” Microsoft Visual C++
- Android Handler leak 分析及解决办法
In Android, Handler classes should be static or leaks might occur, Messages enqueued on the applicat ...
- 防止黑客对服务器IP地址的攻击
下面的参数都是系统默认的: [root@ok etc]# cat /proc/sys/net/ipv4/conf/eth0/accept_source_route [root@ok etc]# cat ...
- hdu 1166:敌兵布阵(树状数组 / 线段树,入门练习题)
敌兵布阵 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submis ...
- [译]SQL Server 之 查询计划缓存和重编译
查询优化是一个复杂而且耗时的操作,所以SQL Server需要重用现有的查询计划.查询计划的缓存和重用在多数情况下是有益的的,但是在某些特殊的情况下,重编译一个查询计划可能能够改善性能. SELECT ...