不一样的JavaScript(6)——函数调用

原创 2013年12月06日 10:43:20

1. 和C++/C#/Java类似,函数在被调用的时候用this指向函数的上下文对象。

1.1. 当函数没有与某个上下文对象绑定的时候,this指向全局的window对象。例如:

window.number = 10;

function printNumber() {
    console.log(this.number);
}

printNumber();

在上述代码中,由于this指向windows对象,因此输出为10。

1.2.当函数与某个对象绑定的时候,this指向该对象。例如:

function printNumber() {
    console.log(this.number);
}

var obj = {
    number: 8,
    print: printNumber
};

obj.print();

在上述代码中,函数printNumber通过对象obj调用,因此this指向了对象obj。代码的输出是8。

2. 函数还可以通过apply和call两种方式传入this指向的对象并调用。

2.1 通过apply调用函数时,第一个参数指定this指向的对象,第二个参数是一个参数数组,或者一个arguments对象。例如:

function addNumber(num1, num2) {
    console.log(this.number + num1 + num2);
}

var obj = {
    number: 8
};

function applyAdd1(num1, num2) {
    addNumber.apply(obj, [num1, num2]);
}

function applyAdd2(num1, num2) {
    addNumber.apply(obj, arguments);
}

applyAdd1(4, 5);
applyAdd2(4, 5);

在上述代码中,applyAdd1和applyAdd2都是通过apply调用函数addNumber,只是传入第二个参数的方法不一样。它们的功能也是一样的,都输出17。

2.2 如果用call调用函数,第一个参数传入this指向的对象,后面顺序传入其他参数。例如:

function addNumber(num1, num2) {
    console.log(this.number + num1 + num2);
}

var obj = {
    number: 8
};

function callAdd(num1, num2) {
    addNumber.call(obj, num1, num2);
}

callAdd(4, 5);

和前面一样,上述代码仍然输出17。

3. 我们还可以用bind函数显示地把函数和一个对象绑定起来,然后再在这个对象上调用该函数。例如:

function addNumber(num1, num2) {
    console.log(this.number + num1 + num2);
}

var obj = {
    number: 8
};

var addObjNumber = addNumber.bind(obj);
addObjNumber(4, 5);

由于函数addNumber通过bind函数显示地和对象obj绑定起来,再调用addNumber的时候,this指向的就指向了obj。因此,上述代码仍然输出17。

4. 可以在函数声明之后立即调用。利用这个特性,我们可以实现Singleton模式。下面是一段示例代码:

var singleton = function(data) {
    function Singleton() {
        this.data = data;
    };
    
    Singleton.prototype.func = function() {
        console.log(this.data);
    }
    
    return new Singleton(data);
    
}("Hello, singleton");

singleton.func(); // Hello, singleton




不一样的JavaScript(4)——函数参数

1. 在Javascript中,如果函数申明时的参数个数和函数调用时的参数个数不相等,并不会引起语法错误。 1.1 如果函数声明时的参数个数多于函数调用时的参数个数,在调用时没有设置的参数会被自动设为...
  • haitaohe
  • haitaohe
  • 2013年09月10日 17:01
  • 3106

不一样的Javascript(10)——函数嵌套

1. 在Javascript中,函数中可以嵌套其他函数。例如: function distance(x1, y1, x2, y2) { function square (x) { ...
  • haitaohe
  • haitaohe
  • 2013年12月17日 17:17
  • 5508

js调用其他js文件的函数,以及js加载过程

我们在编写js时,通常会需要在一个js文件中调用另一个js文件的函数,那么如何调用呢? 例如我有一个a.js文件,功能是弹出一个窗口的函数,我在b.js文件中需要调用这个函数,写法如下(函数开头弹窗...
  • sinat_32290679
  • sinat_32290679
  • 2016年08月24日 15:57
  • 3565

【JavaScript】基础整理——函数调用相关

HTML JavaScript 函数调用
  • sky15732625340
  • sky15732625340
  • 2017年04月29日 11:21
  • 428

深究JavaScript——函数调用与this详解

this绑定时间  js的this总是指向一个对象,而这个对象是基于函数运行时动态绑定的,并非函数声明时绑定。函数调用方式 作为对象的方法调用 作为普通函数进行调用 作为构造器进行调用 通过apply...
  • stavencsdn
  • stavencsdn
  • 2016年12月28日 14:55
  • 182

不一样的Javascript(11)——函数与对象

1. 每个函数都是对象,因此函数上可以定义自己的属性。例如: test.counter = 0; function test() { console.log(test.counter); ...
  • haitaohe
  • haitaohe
  • 2013年12月17日 17:50
  • 675

数据结构基础(6)--递归和函数调用--汉诺塔问题C语言实现

C语言实现汉诺塔问题!
  • Davidluo001
  • Davidluo001
  • 2015年06月24日 14:57
  • 1979

JavaScript函数调用及嵌套

函数调用 函数的调用和C中差不多,但形式可能有点不同。JavaScript的函数调用形式为:(函数)(参数列表)或者函数名(参数列表)。后者和C是一样的,但前者和C是迥然不同的,因为C中函数声明...
  • sysuzjz
  • sysuzjz
  • 2016年02月03日 14:20
  • 442

JavaScript中七种函数调用方式及对应 this 的含义

文章转自:http://blog.sina.com.cn/s/blog_621f1e120100rj21.html this 在 JavaScript 开发中占有相当重要的地位,不过很多人对this...
  • Night_Emperor
  • Night_Emperor
  • 2017年07月13日 21:00
  • 116

JavaScript函数调用规则

JavaScript函数调用规则一 (1)全局函数调用: function makeArray( arg1, arg2 ){     return [this , arg...
  • xiongzhengxiang
  • xiongzhengxiang
  • 2011年10月09日 09:25
  • 320
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:不一样的JavaScript(6)——函数调用
举报原因:
原因补充:

(最多只允许输入30个字)