Javascript 函数的四种调用模式
Javascript 函数的四种调用模式
1 函数模式
最普通的函数调用
// 声明式函数 function fn1 () { console.log(this); } // 函数表达式函数 var fn2 = function() { console.log(this); }; // 调用 函数中this表示全局对象,在浏览器中就是指window fn1(); //window fn2(); //window
2 方法模式
函数依附于一个对象,是对象的一个属性,我们再调用这个函数。这种模式就是方法调用模式。
var obj = { name: "zhangSan", sayHi: function () { console.log(this); } }; obj.sayHi(); //obj对象
3 构造器调用模式
即是构造函数的调用,一般是通过new + 函数名( ),这种模式和以上的方法模式没本质的区别
function Person() {} var tom = new Person(); // 这就是构造器函数的调用 // 构造函数调用的详细过程 // 1 会在内部创建一个对象o // 2 给对象赋值(this), 然后执行各种操作 // 3 返回这个对象o // 构造函数的返回值: // // 有一个默认的返回值,新创建的对象(实例); // 当手动添加返回值后(return语句): // 1. 返回值是基本数据类型-->真正的返回值还是那个新创建的对象(即实例) // 2. 返回值是复杂数据类型(对象)-->真正的返回值是这个对象
4 上下文模式
本质--对象借用不属于该对象的方法(函数),即我们自定义this的指向
这时候就需要call和apply这两个方法
//Function.prototype.call () //Function.prototype.apply () //——>任何函数都可以调用call和apply方法 // 第一个参数控制this的指向,第二个参数: 在使用 上下文调用的 时候, 原函数(方法)可能会带有参数, 那么这个参数在上下文调用中使用 第二个( 第 n 个 )参数来表示
//伪数组 var o={ 0:10,1:20,length:2 }; //让o对象借用数组的push方法来添加元素 //[].push.call(o,30,50,70) [].push.apply(o,[1,2,3]) console.log(o);//其中对象o中length属性的值也会改变的哦
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
相关推荐
-
JS函数的定义与调用方法推荐
JS函数调用的四种方法:方法调用模式,函数调用模式,构造器调用模式,apply,call调用模式 1. 方法调用模式: 先定义一个对象,然后在对象的属性中定义方法,通过myobject.property来执行方法,this即指当前的myobject对象. var blogInfo={ blogId:123, blogName:"werwr", showBlog:function(){alert(this.blogId);} }; blogInfo.showBlog(); 2. 函数调用
-
javascript函数的四种调用模式
1.介绍 先介绍一下函数的调用模式有哪四种: 函数调用模式, 方法调用模式, 构造函数调用模式, 上下文调用模式: 在这里对于函数的调用模式,主要介绍每种调用模式的this的指向和返回值. 2.代码分析 ①.函数调用模式 下面的调用模式就是大家最熟悉的函数调用模式,而函数调用模式的this指向和返回值是什么呢? function fn1 () { console.log(this); }; fn1(); // 在调用函数fn1时,输出的this的结果是Window 在上述代码中,fn1也就是函数
-
浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序
在Javascript定义一个函数一般有如下三种方式: 函数关键字(function)语句: function fnMethodName(x){alert(x);} 函数字面量(Function Literals): var fnMethodName = function(x){alert(x);} Function()构造函数: var fnMethodName = new Function('x','alert(x);') // 由Function构造函数的参数个数可变.最后一个参数写函数体
-
Javascript调用函数方法的几种方式介绍
javascript语法灵活,同一个功能有五六种实现方式并不罕见,然后再加上有些反人类的原型继承和异步特性,就更让人一头雾水了.我经常搞不清楚call,apply之间的区别,今天就记录一下,以免再忘了. 在javascript中,方法可以通过以下几种方式执行: 1.func(),这是最直接最常见的调用方式,也符合一般人的思维逻辑,但是在某些情况下有一些不足,下面会解释. 2.(function(arg){})(window),匿名方法调用,在构造命名空间时比较有用,后面的括号中的参数与匿名方法中
-
JS函数的几种定义方式分析
本文实例讲述了JS函数的几种定义方式.分享给大家供大家参考,具体如下: JS函数的定义方式比较灵活,它不同于其他的语言,每个函数都是作为一个对象被维护和运行的. 先看几种常用的定义方式: function func1([参数]){/*函数体*/} var func2=function([参数]){/*函数体*/}; var func3=function func4([参数]){/*函数体*/}; var func5=new Function(); 上述第一种方式是最常用的方式,不用多说. 第二种
-
js函数调用的方式
Js函数调用的方式有如下几种情况: (1)具名函数直接调用 复制代码 代码如下: function foo() { } foo(); (2)匿名函数通过引用来调用 复制代码 代码如下: fooRef = function() { }fooRef(); (3)没有引用的匿名函数调用1 复制代码 代码如下: (function() {}()); (4)没有引用的匿名函数调用2 复制代码 代码如下: (function() { })(); (5)没有引用的匿名函数调用3 复制代码 代码如下
-
js中函数调用的两种常用方法使用介绍
一个js函数 function test(aa){ window.alert("你输入的是"+aa); } 方法一:直接调用 test("dddd"); 方法二:函数赋值给变量 var abc=test; abc('中国');//用变量来调用函数 注意: 当我们写成这种形式的时候,var abc=test("dddd"); 不能通过变量abc来调用函数. 这种写法当test有返回值的时候会把返回值赋值给abc,当没有返回值的时候abc的值为und
-
js函数调用常用方法详解
来源 javascript语言精粹.这不是书上的源代码. js的函数调用会免费奉送两个而外的参数就是 this 和 arguments .arguments是参数组,他并不是一个真实的数组,但是可以使用.length方法获得长度. 书上有说4中调用方式: 方法调用模式 函数调用模式 构造器调用模式 apply调用模式 下面我们来看看一些实例更好理解. 1:方法调用模式 请注意this此时指向myobject. 复制代码 代码如下: /*方法调用模式*/ var myobject={ value:
-
JavaScript函数的4种调用方法详解
在JavaScript中,函数是一等公民,函数在JavaScript中是一个数据类型,而非像C#或其他描述性语言那样仅仅作为一个模块来使用.函数有四种调用模式,分别是:函数调用形式.方法调用形式.构造器形式.以及apply形式.这里所有的调用模式中,最主要的区别在于关键字 this 的意义,下面分别介绍这个几种调用形式. 本文主要内容: 1.分析函数的四种调用形式2.弄清楚函数中this的意义3.明确构造函对象的过程4.学会使用上下文调用函数 一.函数调用形式 函数调用形式是最常见的形式,也是最
-
Javascript 函数的四种调用模式
Javascript 函数的四种调用模式 1 函数模式 最普通的函数调用 // 声明式函数 function fn1 () { console.log(this); } // 函数表达式函数 var fn2 = function() { console.log(this); }; // 调用 函数中this表示全局对象,在浏览器中就是指window fn1(); //window fn2(); //window 2 方法模式 函数依附于一个对象,是对象的一个属性,我们再调用这个函数.这种模式就
-
JavaScript四种调用模式和this示例介绍
JavaScript调用时除了声明时定义的形参外,每个函数接受两个附加参数:this 和arguments,this在面向对象编程中非常重要,它取决于调用模式. JavaScript有四种调用模式,方法调用模式,函数调用模式,构造器调用模式和apply调用模式.这些模式在初始化关键参数this上存在差异. 方法调用模式:当一个函数被保存为对象的一个属性时,我们称它为一个方法,当一个方法被调用时,this被绑定到该对象上.如果调用表达式包含一个属性取表达式(即一个.点表达式或[script]下标表
-
浅谈JavaScript函数的四种存在形态
函数的四种存在形态: 1.函数形态 2.方法形态 将函数赋值给某一个对象的成员,那么就称为方法 3.构造器形态 4.上下文形态 1.函数形态: var foo = function() { alert(this); //this是window }; 2.方法形态: o = {}; o.foo = foo; //将函数foo赋值给对象o的foo属性 o.foo(); //弹出的是object,此时的this表示object var lib = { test:function() { alert(t
-
JavaScript创建对象的四种常用模式实例分析
本文实例讲述了JavaScript创建对象的四种常用模式.分享给大家供大家参考,具体如下: 这里介绍了javascript中创建对象常用的几种模式,包括:工厂模式,构造函数模式,原型模式,组合构造函数与原型的模式,动态原型模式. 一.工厂模式 看如下代码: function getMySon(name,sex){ var o={}; o.name=name; o.sex=sex; o.sayName = function(){ alert(this.name); } return o; } so
-
JavaScript函数的4种调用方法实例分析
本文实例讲述了JavaScript函数的4种调用方法.分享给大家供大家参考,具体如下: JavaScript 函数有 4 种调用方式: 1. 作为一个函数调用 2. 函数作为方法调用 3. 使用构造函数调用函数 4. 作为函数方法调用函数 分述如下: 每种方式的不同方式在于 this 的初始化. 作为一个函数调用 function myFunction(a, b) { return a * b; } myFunction(10, 2); // myFunction(10, 2) 返回 20 以上
-
javascript 具名函数的四种调用方式 推荐第1/3页
1.()小括号运算符 平时最常用的就是()运算符来调用一个函数 复制代码 代码如下: //无参函数fun1 function fun1() { alert('我被调用了'); } fun1() //有参函数fun2 function fun2(param) { alert(param); } fun2('我被调用了') ECMAScript3后加入给Function加入了call和apply后,就有了下面两种 2.call 复制代码 代码如下: //无参函数fun1 function fun1(
-
函数四种调用模式以及其中的this指向
第一种:函数直接执行模式 function add(a,b){ console.log(this); return a+b; } add(10,20)//this===window 第二种:对象方法的调用模式 var obj={ name:'aaa', age:20, said:function(){ console.log(this); } } obj.said();//this===obj,此处this指代被调用者 第三种:构造器的调用模式 function School(){ this.s
-
详解Javascript函数声明与递归调用
Javascript的函数的声明方式和调用方式已经是令人厌倦的老生常谈了,但有些东西就是这样的,你来说一遍然后我再说一遍.每次看到书上或博客里写的Javascript函数有四种调用方式,我就会想起孔乙己:茴字有四种写法,你造吗? 尽管缺陷有一堆,但Javascript还是令人着迷的.Javascript众多优美的特性的核心,是作为顶级对象(first-class objects)的函数.函数就像其他普通对象一样被创建.被分配给变量.作为参数被传递.作为返回值以及持有属性和方法.函数作为顶级对象,
随机推荐
- 三种AngularJS中获取数据源的方式
- Swift网络请求库Alamofire使用详解
- javascript字典探测用户名工具
- Redis上实现分布式锁以提高性能的方案研究
- vbs复制文件的脚本
- Java web过滤器验证登录防止未登录进入界面
- 利用spring AOP记录用户操作日志的方法示例
- ASP.net Textbox的技巧使用
- js 轮播效果实例分享
- 举例讲解Python中is和id的用法
- 简单了解JavaScript操作XPath的一些基本方法
- VBS基础编程教程 (第1篇)
- python中遍历文件的3个方法
- js 数值转换为3位逗号分隔的示例代码
- Jquery选择器 $实现原理
- 无数据库的详细域名查询程序PHP版(4)
- 8wa.com为您提供免费ASP空间服务
- 一个C#开发者重温C++的心路历程
- elementUI select组件使用及注意事项详解
- Android接入微信支付的方法