函数

定义函数

JS中有3种定义函数的方法:

函数声明

用函数声明定义函数的方式如下:

function abs(x) {
if (x >= 0) {
return x;
} else {
return -x;
}
}

上述abs()函数的定义如下:

  • function指出这是一个函数定义;
  • abs是函数的名称;
  • (x)括号内列出函数的参数,多个参数以,分隔;
  • { ... }之间的代码是函数体,可以包含若干语句,甚至可以没有任何语句。

注意,函数体内部的语句在执行时,一旦执行到return时,函数就执行完毕,并将结果返回。如果没有return语句,函数执行完毕后也会返回结果,只是结果为undefined。

函数表达式

用函数表达式定义函数的方式如下:

var abs = function(x) {
if (x >= 0) {
return x;
} else {
return -x;
}
}

在这种方式下,function (x) { ... }是一个匿名函数,它没有函数名。但是,这个匿名函数赋值给了变量abs,所以,通过变量abs就可以调用该函数。

函数构造法

// 参数必须加引号
var add = new Function('x','y','return x+y');
add(2,3); // 5

一般不推荐用这种方法定义函数,因为这种语法会导致解析两次代码(第一次是解析常规ECMAScript代码,第二次是解析传入构造函数中的字符串),从而影响性能。

函数声明和函数表达式的差别

对于函数声明,JS解析器会在预解析阶段优先读取函数声明的代码,以确保函数能够被引用到;而对于函数表达式,只有在执行到相应的语句时才进行解析。在实际中,具体表现在:当使用函数声明的形式来定义函数时,可将调用放在函数声明之前,而使用函数表达式,这样做的话会报错。

add(1,2); // 3
function add(x, y) {
return x + y;
}
add(2,3); // 5
add(1,2); // 报错
var add = function(x, y) {
return x + y;
}
add(2,3); // 5

调用函数方式

1、普通调用

调用函数时,按顺序传入参数即可:

abs(10); // 返回10
abs(-9); // 返回9

由于JavaScript允许传入任意个参数而不影响调用,因此传入的参数比定义的参数多也没有问题,虽然函数内部并不需要这些参数:

abs(10, 'blablabla'); // 返回10
abs(-9, 'haha', 'hehe', null); // 返回9

2、方法调用

//定义一个函数
function hello(name) {
alert('hello,' + name);
};
var user = {}; //赋值给user的sayHi属性
user.sayHi = hello; //方法调用
user.sayHi('张三');

3、构造函数调用

1.当使用new关键字创建一个对象时,即调用了构造函数。构造函数若没有形参,可以省略圆括号:

var obj = new Object();
//等价于
var obj = new Object;

2.调用构造函数,创建了一个新对象,这个新对象会成为该构造函数的调用上下文(this的值)

function User(name) {
this.name=name;
console.debug(this);
} var user = new User('张三');

4、call和apply

call和apply的作用是改变函数执行时的上下文,即改变函数运行时的this指向。

一言不合贴代码:

function Person(name){
this.name = name;
}
Person.prototype = {
constructor: Person,
showName: function(){
console.log(this.name);
}
}
var person = new Person('Jeepeng');
person.showName(); // Jeepeng var animal = {
name: 'cat'
} // 1 call
person.showName.call(animal); // cat
// 2 apply
person.showName.apply(animal); // cat

二者的作用完全一样,区别只在于这两个函数接受的参数形式不同。

obj.call(thisObj, arg1, arg2, ...);
obj.apply(thisObj, [arg1, arg2, ...]);

一言不合贴代码:

function sum() {
var length = arguments.length;
var result = 0;
for(var i = 0; i < length; i++) {
result += arguments[i]; // 不严谨,仅为了说明问题
}
return result;
} sum(1,2,3,4,5); // 15 sum.call(null, 1,2,3,4,5); // 15
sum.apply(null, [1,2,3,4,5]); // 15

当你的参数是明确知道数量时,用 call,而不确定的时候,用 apply,然后把参数 push 进数组传递进去。当参数数量不确定时,函数内部也可以通过 arguments 这个数组来便利所有的参数。

5-JS函数的更多相关文章

  1. 3.3 js函数

    1.函数语法: 函数声明的方式:function 函数名(参数1,参数2-){//函数体;}函数调用:函数名(参数1,参数2-); 函数内不一定都指定返回值. 如果需要指定返回值,可用 return ...

  2. Js函数function基础理解

    正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法.因此,函数名实际上是指向函数对象的指针,不与某个函数绑定.在常见的两种定 ...

  3. js函数表达式和函数声明的区别

    我们已经知道,在任意代码片段外部添加包装函数,可以将内部的变量和函数定义"隐 藏"起来,外部作用域无法访问包装函数内部的任何内容. 例如: var a = 2; function ...

  4. 通用js函数集锦<来源于网络> 【二】

    通用js函数集锦<来源于网络> [二] 1.数组方法集2.cookie方法集3.url方法集4.正则表达式方法集5.字符串方法集6.加密方法集7.日期方法集8.浏览器检测方法集9.json ...

  5. 通用js函数集锦<来源于网络/自己> 【一】

    通用js函数集锦<来源于网络/自己>[一] 1.返回一个全地址2.cookie3.验证用户浏览器是否是微信浏览器4.验证用户浏览器是否是微博内置浏览器5.query string6.验证用 ...

  6. 100多个基础常用JS函数和语法集合大全

    网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法: 1.输出语句:document.write(""); 2.JS中的注释为//3.传统 ...

  7. JS函数

    1.document.write(""); 输出语句2.JS中的注释为//3.传统的HTML文档顺序是:document->html->(head,body)4.一个浏 ...

  8. js函数和运算符

    函数是由事件驱动或者它被调用时执行可重复使用的代码块. <script> function myFunction(){ Alert(“hello World!”): } </scri ...

  9. JavaScript学习03 JS函数

    JavaScript学习03 JS函数 函数就是包裹在花括号中的代码块,前面使用了关键词function: function functionName() { 这里是要执行的代码 } 函数参数 函数的 ...

  10. JSF页面中使用js函数回调后台bean方法并获取返回值的方法

    由于primefaces在国内使用的并不是太多,因此,国内对jsf做系统.详细的介绍的资料很少,即使有一些资料,也仅仅是对国外资料的简单翻译或者是仅仅讲表面现象(皮毛而已),它们的语句甚至还是错误的, ...

随机推荐

  1. Servlet里写验证码

    public class CodeServlet extends HttpServlet { /** * The doGet method of the servlet. <br> * * ...

  2. PHP中9大缓存技术总结(转载 http://www.php100.com/html/php/lei/2015/0919/8969.html)

    PHP中9大缓存技术总结 来源:   时间:2015-09-19 02:40:33   阅读数:57767 分享到: 12 [导读] 1.全页面静态化缓存也就是将页面全部生成html静态页面,用户访问 ...

  3. php session session_set_save_handler 接管所有的session管理工作

    一个已知管用的方法是,使用session_set_save_handler,接管所有的session管理工作,一般是把session信息存储到数 据库,这样可以通过SQL语句来删除所有过期的sessi ...

  4. 【转】转换到 COFF 期间失败: 文件无效或损坏

    不知怎么本来编译好好的VS2010环境,忽然出现“转换到 COFF 期间失败: 文件无效或损坏”的链接错误.花了好多天,试了好多方法,最终解决了这个问题.   现在罗列一下这几种解决方案:   方案1 ...

  5. java web sql注入测试(1)---概念概述

    在进行java web 测试时,经常会忽略的测试种类就是sql注入测试,这类缺陷造成的原因是开发技术在这方面欠缺的表现,虽然不常见,但一旦有这类缺陷,就很因此对运营的数据造成很多不必要的损失,所以,还 ...

  6. DB2 表空间和缓冲池

    简介 对于刚涉足 DB2 领域的 DBA 或未来的 DBA 而言,新数据库的设计和性能选择可能会很令人困惑.在本文中,我们将讨论 DBA 要做出重要选择的两个方面:表空间和缓冲池.表空间和缓冲池的设计 ...

  7. TVideoGrabber如何将网络摄像头影像实时发布到网络

    在TVideoGrabber中如何将网络摄像头影像实时发布到网络?如何设置正在运行TVideoGrabber的一台电脑,同时通过另一台电脑在网络中实时的观看在线视频呢? 在这里称发送视频流的电脑为“m ...

  8. webssh software

    shellinabox是由Markus Gutschke开发的一款自由开源的基于Web的Ajax的终端模拟器.它使用AJAX技术,通过Web浏览器提供了类似原生的 Shell 的外观和感受. yum ...

  9. ch1:python3 查看版本号、安装目录和工作空间目录

    查看python版本: 每次打开python顶端会显示版本号 在程序中判断版本号可以通过import sys  sys.version 在dos下可以通过python -V查看 安装目录:C:\Pyt ...

  10. 【jqGrid for ASP.NET MVC Documentation】.学习笔记.6.分层

    1 两级分层 每个父 grid 的行,都能有子 grid .这被叫做 层次,它用来显示相关的 表,主信息 –> 明细信息等. } 一旦你为 父子 grid 都定义了 Models ,下一步就是设 ...