第196天:js---调用函数的五种方式
一、普通方式
/*普通模式*/
// 声明一个函数,并调用
function func() {
console.log("Hello World");
}
func();
二、函数表达式
/*函数表达式*/
// 使用函数的Lambda表达式定义函数,然后调用
var func = function() {
console.log("你好,百度一下");
};
func(); //可以发现函数调用很简单,就是平时学习的一样.
//这里的关键是,在函数调用模式中,函数里的 this 关键字指全局对象,
//如果在浏览器中就是 window 对象. 例如:
var func = function() {
console.log(this);
};
func();
// 此时,会弹出对话框,打印出 [object Window]
三、方法调用模式
/*方法调用模式*/
//函数调用模式很简单,是最基本的调用方式.
//但是同样的是函数,将其赋值给一个对象的成员以后,就不一样了.
//将函数赋值给对象的成员后,那么这个就不在称为函数,而应该叫做方法. // 定义一个函数
var func = function() {
alert("我是一个函数么?");
}; // 将其赋值给一个对象
var o = {};
o.fn = func; // 注意这里不要加圆括号
// 调用
o.fn(); //此时,o.fn 则是方法,不是函数了.
//实际上 fn 的方法体与 func 是一模一样的,但是这里有个微妙的不同. 看下面的代码:
// 接上面的代码
alert(o.fn === func);
//打印结果是 true ,这个表明两个函数是一样的东西. 但是修改一下函数的代码: // 修改函数体
var func = function() {
alert(this);
};
var o = {};
o.fn = func;
// 比较
alert(o.fn === func);
// 调用
func();
o.fn();
// 这里的运行结果是,两个函数是相同的,因此打印结果是 true.
// 但是由于两个函数的调用是不一样的,
// func的调用,打印的是 [object Window],而o.fn 的打印结果是[object Object].
// 这里便是函数调用与方法调用的区别.
// 函数调用中,this专指全局对象window,
// 而在方法中this专指当前对象. 即o.fn 中的this 指的就是对象o.
四、构造函数调用模式
/*构造函数调用模式*/
// 同样是函数,在单纯的函数模式下,this表示window;
// 在对象方法模式下,this指的是当前对象.
// 除了这两种情况,JavaScript中函数还可以是构造器.
// 将函数作为构造器来使用的语法就是在函数调用前面加上一个new关键字. 如代码:
// 定义一个构造函数
var Person = function() {
this.name = "百度一下";
this.sayHello = function() {
alert("你好,这里是" + this.name);
};
};
// 调用构造器,创建对象
var p = new Person();
// 使用对象
p.sayHello();
// 上面的案例首先创建一个构造函数Person,然后使用构造函数创建对象p.
// 这里使用 new语法.然后使用对象调用sayHello()方法.
// 这个使用构造函数创建对象的案例比较简单. 从案例可以看到,此时 this指的是对象本身.
五、apply、call调用模式
上篇中详细讲解了。
第196天:js---调用函数的五种方式的更多相关文章
- JS调用函数的两种方式
<script type="text/javascript"> window.onload = init; //onload 表示页面全部加载完毕后,再调用init() ...
- JS定义函数的2种方式以及区别简述(为什么推荐第二种方式)
无意中看到了阮一峰大神多年前的一篇博客: 12种不宜使用的Javascript语法 看到第9条的时候受到了启发,感觉之前没怎么理解清楚的一些问题好像突然就清晰了,如下图 可能光这样看,有些小伙 ...
- JS定义函数的两种方式:函数声明和函数表达式
函数声明 关于函数声明的方式,它的一个重要的特性就是函数声明提升(function declaration hoisting),意思是在执行代码之前会先读取函数声明.这就意味着可以把函数声明放在调用它 ...
- js实现继承的五种方式
function Parent(firstname) { this.fname=firstname; ; this.sayAge=function() { console.log(this.age); ...
- JS调用webservice的两种方式
协议肯定是使用http协议,因为soap协议本身也是基于http协议.期中第二种方式:只有webservice3.5以后版本才可以成功 第一种方式:构造soap格式的body,注意加粗的黄色标识,比如 ...
- js中声明Number的五种方式
转载自:http://www.jb51.net/article/34191.htm <!DOCTYPE html> <html> <head> <meta c ...
- js setTimeout 传递带参数的函数的2种方式
js setTimeout 传递带参数的函数的2种方式 Created by Marydon on 2018年9月14日 1.准备工作 function sayYourName(param) { ...
- resize函数有五种插值算法
转自http://blog.csdn.net/fengbingchun/article/details/17335477 最新版OpenCV2.4.7中,cv::resize函数有五种插值算法:最近邻 ...
- JS创建对象,数组,函数的三种方式
害怕自己忘记,简单总结一下 创建对象的3种方法 ①:创建一个空对象 var obj = {}; ②:对象字面量 var obj = { name: "Tom", age: 27 ...
随机推荐
- sort与qsort的异同
主要内容: 1.qsort的用法 2.sort的用法 3.qsort和sort的区别 qsort的用法: 原 型: void qsort(void *base, int nelem, int widt ...
- vim 中文乱码问题
编辑~/.vimrc文件,加上如下几行: set fileencodings=utf-8,ucs-bom,gb18030,gbk,gb2312,cp936 set termencoding=utf ...
- DIV+CSS实现竖排按钮样式
<div class="btn_left btn_left1">每日单元成功率</div><br/> <div class="b ...
- WPF 带刻度的滑动条实现
原文:WPF 带刻度的滑动条实现 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/BYH371256/article/details/83507170 ...
- day 12 文件操作
1.文件定位读写 f.seek(2,0) ##### f.seek(2,0) In [4]: f = open("test.py","r") In [5]: ...
- MSP430编译器__intrinsic指令
1. 在文件intrinsics.c里面发现很多函数前面有__intrinsic,说是这些是MSP430的特定函数(其他单片机用不了),应该和编译器有关,并没有具体的函数实现,我猜测,是直接转成汇编代 ...
- 我们一起学习WCF 第一篇初识WCF(附源码供对照学习)
前言:去年由于工作需要我学习了wcf的相关知识,初期对wcf的作用以及为何用怎么样都是一知半解,也许现在也不是非常的清晰.但是通过项目对wcf的运用在脑海里面也算有了初步的模型.今天我就把我从开始wc ...
- meta标签的常见用法
一.定义和用法 <meta> 标签始终位于 head 元素中.<meta> 元素可提供有关页面的元信息(meta-information),元数据不会显示在页面上,但是对于机器 ...
- JVM知识(上)
目录 什么是JVM? JVM的生命周期 JVM的体系结构 JVM的数据类型 java虚拟机被称为"虚拟",因为它是一个抽象的计算机定义的规范.要运行一个Java程序,需要一个抽象的 ...
- 完美的【去重留一】SQL
DELETE consum_record FROM consum_record, ( SELECT min(id) id, user_id, monetary, consume_time FROM c ...