关闭

js调用函数的几种方法_ES5/ES6的函数调用方式

时间: 2018-04-16阅读: 3540标签: 函数

这篇文章主要介绍ES5中函数的4种调用,在ES5中函数内容的this指向和调用方法有关。以及ES6中函数的调用,使用箭头函数,其中箭头函数的this是和定义时有关和调用无关


一、ES5函数调用模式

包括函数名()和匿名函数调用,this指向window

 function getSum() {
    console.log(this) //window
 }
 getSum()
 
 (function() {
    console.log(this) //window
 })()
 
 var getSum=function() {
    console.log(this) //window
 }
 getSum()


二、ES5方法调用

对象.方法名(),this指向对象

var objList = {
   name: 'methods',
   getSum: function() {
     console.log(this) //objList对象
   }
}
objList.getSum()


三、ES5构造器调用

new 构造函数名(),this指向构造函数

function Person() {
  console.log(this); //指向构造函数Person
}
var personOne = new Person();


四、ES5间接调用

利用call和apply来实现,this就是call和apply对应的第一个参数,如果不传值或者第一个值为null,undefined时this指向window

function foo() {
   console.log(this);
}
foo.apply('我是apply改变的this值');//我是apply改变的this值
foo.call('我是call改变的this值');//我是call改变的this值


ES6中函数的调用

箭头函数不可以当作构造函数使用,也就是不能用new命令实例化一个对象,否则会抛出一个错误
箭头函数的this是和定义时有关和调用无关,调用就是函数调用模式

(() => {
   console.log(this)//window
})()

let arrowFun = () => {
  console.log(this)//window
}
arrowFun()

let arrowObj = {
  arrFun: function() {
   (() => {
     console.log(this)//arrowObj
   })()
   }
 }
 arrowObj.arrFun();
 
站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: http://www.fly63.com/article/detial/644

引用类型作为函数参数何解

在向函数传递引用类型的参数时,相当于把引用类型的地址复制给函数内的一个局部变量,所以局部变量和传入的参数会指向内存中的同一个对象。 局部变量的变化也会映射到传入参数

前端常用的js函数方法整理

判断js类型: js有自己判断方法 typeof 但是当他遇到引用类型的时候得到的结果往往不是我们想要的,有没有时候后台返回的参数是null或者undefined然后就被丢到了页面上,很难看,要每一个地方都去处理

玩转Js函数式编程

最近和一些同学讨论了函数式编程,很多同学总觉得听起来很高大上,但用起来却无从下手。于是我抽时间捋了捋,将平时工作中用到的函数式编程案例和思想整理了出来

js中浏览器兼容startsWith 、endsWith 函数

在做js开发的时候用到了startsWith函数时,发现各个浏览器不兼容问题,因为对开发来说,chrome浏览器最好用,就一直在chrome浏览器中使用这两个函数没有任何问题,但在ie浏览器访问就直接报错,因为ie没有这两个函数,要么修改方法,换别的方法,但是一两个还好改,多了就不好改

10个实用的工具函数

生成一周时间:new Array 创建的数组只是添加了length属性,并没有实际的内容。通过扩展后,变为可用数组用于循环;判断核心使用Object.prototype.toString,这种方式可以准确的判断数据类型。

在vue项目中,如何定义全局变量/全局函数?

如题,在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录token,用户的地址信息等,这时候就需要设置一波全局变量和全局函数

Js中document.execCommand()函数的使用

document.execCommand()方法处理Html数据时常用语法格式如下:document.execCommand(sCommand[,交互方式, 动态参数])其中:sCommand为指令参数(如下例中的”2D-Position”),交互方式参数如果是true的话将显示对话框,如果为false的话,则不显示对话框

JavaScript 自己写一个 replaceAll() 函数

JavaScript 的 replace() 方法可以在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。但是,只输入字符串的话,仅替换第一个字符,当然也可以用正则表达式来进行全局替换:

js高阶函数

高阶函数定义(至少满足下面条件之一的函数) :1.函数作为形参传递,2.函数作为返回值输出,回调函数(异步回调,达到异步执行条件将回调函数放入执行队列中执行)

理解 JavaScript Mutation 突变和 PureFunction 纯函数

不可变性、纯函数、副作用,状态可变这些单词我们几乎每天都会见到,但我们几乎不知道他们是如何工作的,以及他们是什么,他们为软件开发带来了什么好处。在这篇文章中,我们将深入研究所有这些,以便真正了解它们是什么以及如何利用它们来提高我们的Web应用程序的性能。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!