一、函数的一些基础概念:

1.js中的函数使用function来声明。

2.关于return:

2.1  函数在执行到return语句后悔立即停止并退出,return后面的代码永远不会得到执行;

2.2  函数不必指定是否返回值,只要return语句后跟要返回的值即可实现返回值;

2.3  return语句不带任何返回值时,会返回undefined值,这种做法一般用在需要提前停止函数执行而又不需要返回值的情况。

3.理解参数:

3.1  函数不介意传递进来参数个数以及类型,因为js中的参数在内部是用一个数组来表示的,函数接收到的始终是这个数组,至于数组中包含的内容并不关心。

(即使你定义的函数只接收两个参数,那么你传递一个或三个或不传参数都无所谓);

3.2  可以使用arguments对象来访问参数数组,arguments[i]来访问第i+1个参数,arguments.length确定传递进来的参数的个数;

3.3  没有传递值的命名参数将被自动赋值undefined;

3.4  js中所有的参数都是值传递,没有引用传递;

4.没有重载:如果出现两个相同名字的函数,后者会覆盖前者。但是我们可以控制传递参数的类型和数量让函数做出不同的反应,从而模仿重载的实现。

二、深入理解Function类型

JS 中Function类型实际上是一种对象,每一个函数实际上都是Function类型的一个实例,函数通常是使用函数声明语法定义的,每一个函数都有一些默认的属性和方法;

由于函数是对象,故函数名实际上也是一个指向函数对象的指针变量,不会与某个函数绑定,函数是对象,函数名是指针。

 

1.函数声明与表达式

函数声明会优先被读取使用(可以提前访问)。

    console.log(test(10,10))  //20
function test(num1,num2) {
return num1+num2;
}

函数表达式则必须等到执行完它所在的表达行后再可以使用。

    console.log(test(10,10))  //会报错
var test = function (num1,num2) {
return num1+num2;
};

2.作为值的函数

js中的函数名本身就是变量,所以函数也可以作为值来使用,可以像传递参数一样把一个函数传递给另一个函数。

function sum (num1, num2) {
return num1 + num2;
}
function fuc (num3, num4) {
return num3 + num4;
}
console.log(fuc(sum(2,3), 5));  //

js中的函数名本身就是变量,所以可以将一个函数作为另一个函数的结果返回。

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

3.函数内部属性

在函数内部包含两个特殊的对象:arguments和this

arguments:

arguments 是一个类数组,用来保存函数传递过来的参数。

arguments 中还有一个很重要的属性就是callee,是一个指针变量,指向的是arguments所在的函数本身在递归的时候最好用这个属性,因为如果函数名改变了,也不需要改变内部的实现,arguments.callee()始终代表的是这个函数本身。 

//用arguments.callee的好处是,当函数名改变了以后,不需要改动递归出的函数,
function box(num){
if(num<=1){
return 1;
}else{
return num*arguments.callee(num-1);
//arguments.callee代表的是函数的本身,故和上面是同样的效果
}
}
alert(box(3));//

this:

this 这个属性代表的是它所在的对象本身,this 引用的是函数据以执行的环境对象,也就是函数执行的作用域。

window是JS中最大的一个对象,在window对象中声明一个变量其实就是给window这个对象声明一个属性,var box=1;相当于 window.box=1;也就等价于this.box=1;

当在全局作用域中调用函数时,this 对象引用的就是 window。

在显示的声明一个对象box,这个box中使用的this就代表的是box本身,this.color就是返回的box中属性color的值,而不是window对象中color的值

// this 代表的是对象本身,下面在对象box中的this,就代表对象box
var color='红色'; // window对象的属性, var box={
color:'蓝色',
run:function(){
alert(this.color);//蓝色
return this.color;
}
}
alert(window.color);//红色
alert(this.color); //红色 此处this代表的是window对象,故this.color是代表的window的属性
alert(box.run()); //蓝色

4.函数的属性和方法

每个函数都包含两个属性:length和prototype

length:函数的属性length代表的是函数希望接收的参数的个数,是由声明函数时参数列表中的个数决定的。

prototype:prototype 是保存所有实例方法的真正所在,也就是原型。

prototype 下面有两个方法 apply(),call(),这两个方法都是函数非继承而来的方法,  是每一个函数都具有的方法。

这两个方法的用途都是在特定的作用域中调用函数(看this指向的作用域是谁),也就是说调用特定的对象下面调用函数,有点类似于C#的反射中调用对象的方法。

function sum (num1, num2) {
return num1 + num2;
}
var result = sum.apply(this,[10,20]);
var result = sum.call(this,10,20);
console.log(result);

func.apply():这个方法有两个参数,第一个是要执行这个方法的作用域,也就是传递一个对象过去,第二个参数是一个数组,这个数组中是存放的调用的函数func的实参,也就是要传递给func的值,当然第二个参数可以省略。

func.call():这个方法和上面的apply()方法是一样的,不同的是参数,第一个同样是作用域,是一样的,其余的参数是逐个列举出啦传递给函数的,而不是传递一个数组过去

var color='red';
var box={
color:'green'
} function sayColor(){
return this.color;
} alert(sayColor());        //red 对象是window
alert(sayColor.apply(window));      //red 对象是window
alert(sayColor.apply(this)); //red 对象是window
alert(sayColor.apply(box));     //green 对象是box

 使用这apply()和call()这两个方法来扩充作用域最大的好处是对象不需要与方法发生任何的耦合关系,也就是上面说的对象中可能不存在这个方法,但只要存在这个对象就OK。

javascript 函数详解的更多相关文章

  1. javascript 函数详解2 -- arguments

    今天我们接着上篇文章来继续javascript函数这个主题.今天要讲的是函数对像中一个很重要的属性--arguments. 相关阅读: javascript 函数详解1 -- 概述 javascrip ...

  2. 专题8:javascript函数详解

    函数是一段可以反复调用的代码块.函数还能接受输入的参数,不同的参数会返回不同的值. 函数的声明 JavaScript 有三种声明函数的方法. (1)function 命令 function命令声明的代 ...

  3. javascript函数详解

    //函数的两种声明方式 //在同一个<script>标签中,函数的调用和声明位置可以没有先后的顺序,因为在同一个标签中,都是等加载到内存中,然后在运行 //但是如果是在两个script标枪 ...

  4. JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解

    二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...

  5. [转]javascript console 函数详解 js开发调试的利器

    javascript console 函数详解 js开发调试的利器   分步阅读 Console 是用于显示 JS和 DOM 对象信息的单独窗口.并且向 JS 中注入1个 console 对象,使用该 ...

  6. JavaScript事件详解-jQuery的事件实现(三)

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  7. JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  8. JavaScript正则表达式详解(一)正则表达式入门

    JavaScript正则表达式是很多JavaScript开发人员比较头疼的事情,也很多人不愿意学习,只是必要的时候上网查一下就可以啦~本文中详细的把JavaScript正则表达式的用法进行了列表,希望 ...

  9. JavaScript事件详解-zepto的事件实现

    zepto的event 可以结合上一篇JavaScript事件详解-原生事件基础(一)综合考虑源码暂且不表,github里还有中文网站都能下到最新版的zepto.整个event模块不长,274行,我们 ...

随机推荐

  1. Velocity动态拼接字符串

    1.在全局定义一个变量: #set($varName = "") 2.拼接字符串病截取字符串: #foreach( $role in $adminUser.roles) #set( ...

  2. junit的意义

    写了这么久代码了,自己从来没有好好的玩过junit.马上过年了,打算趁这段时间自己来写一套web框架,但是这里有一个很大的尴尬就是我平时编码并没有认真的来写测试类.那么自己在写框架的时候,不测试肯定是 ...

  3. Servlet开篇

    Servlet开篇 前面我已经说过好多遍了,如何学习好一个东西其实就是2个问题: 1,这个东西是干嘛的?为什么要玩这个东西? 2,怎么样就玩好这个东西了?具体的应该玩这个东西的什么? 其实现在对于我来 ...

  4. linkin大话面向对象--内部类

    内部类说白了就是类中有类 内部类:嵌套类 外部类:宿主类 内部类主要有以下作用:记住了3个字:多继承... 1,内部类提供了更好的封装,可以把内部类隐藏在外部类中,不允许同一个包中的其他类访问该类. ...

  5. PHP的CI框架流程基本熟悉

    CI框架是PHP的一个快速开发框架,我是目前的公司项目后台语言用的PHP,因为我做前端开发,需要用php去填充页面数据,所以就开始去了解这个框架,学习了一些php和数据库的东西,这篇文章先具体介绍CI ...

  6. C# Linq基本常用用法

    1.什么是Linq? Lanaguage Interated Query(语言集成查询),Linq 是集成C# 和VB这些语言中用于提供数据查询能力的一个新特性. 这里只介绍两种基本常用用法. 学习方 ...

  7. shell中数组讲解

    定义数组 在Shell中,用括号来表示数组,数组元素用"空格"符号分割开.定义数组的一般形式为: 代码如下: 数组名=(值1 值2 ... 值n) 例如: 代码如下: array_ ...

  8. Django框架初识

    一.安装: pip3 install django 注意pip加入环境变量,安装好以后记得把Django加入环境变量     安装完成后,会在python目录下多了两个文件:1个django文件,1个 ...

  9. sphinx的再创造coreseek的安装过程

    CoreSeek详细安装过程:coreseek-3.2.14.tar.gz下载链接: http://pan.baidu.com/s/1o6DNesE 解压缩安装mmseg分词程序: .tar.gz c ...

  10. 洛谷 [P3398] 仓鼠找sugar

    树剖求LCA 我们可以发现,两条路径ab,cd相交,当且仅当 dep[lca(a,b)]>=dep[lca(c,d)]&(lca(lca(a,b),c)==lca(a,b)||lca(l ...