评论

一种小程序内使用setInterval循环调用有参函数的方法

一种小程序内使用setInterval循环调用有参函数的方法,通过例子简单解释

首先介绍一下setInterval()

setInterval(functionName,millisec[,"lang"])

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

setInterval()第一个参数是函数类型,意味着你的函数没法加参数。如果加了参数就变成functionName(params),这是你函数的结果,而不是函数类型。

举个错误的例子,用setInterval实现文字循环播放

function a(that){
  var s=that.data.motto
  console.log(s)
  var len= s.length
  var s=s.substring(1,len)+s[0];
  that.setData({
    motto:s
  })
    }
Page({
data: {
    motto'Hello World',
  },
onShow:function(){
    var that=this
  setInterval(a(that),300) //这里a(that)会立即执行,并返回值
  }
})

执行之后会报以下错误:

它说setInterval的第一个参数期望一个function但是没找到,就是因为a(that)返回的不是函数类型。

既然如此,解决办法也就随之而来了。它既然想要一个函数类型,我们给它返回一个函数类型不就行了。

修改后代码如下:

function a(that){
  var s=that.data.motto
  console.log(s)
  var len= s.length
  var s=s.substring(1,len)+s[0];
  that.setData({
    motto:s
  })
  return function(){
    a(that)
  }
    }
Page({
data: {
    motto'Hello World',
  },
onShow:function(){
    var that=this
  setInterval(a(that),300) //这里a(that)会立即执行,并返回值
  }
})

返回一个匿名函数继续调用a(that)

解决。

水平有限,欢迎交流。

引用请加说明。

参考:https://www.cnblogs.com/superdg003/p/5996360.html

https://www.w3school.com.cn/jsref/met_win_setinterval.asp

最后一次编辑于  11-04  
点赞 2
收藏
评论

2 个评论

  • Pt.
    Pt.
    11-05

    再补充一种:参考微信开放文档https://developers.weixin.qq.com/miniprogram/dev/reference/api/setInterval.html

    number setInterval(function callback, number delay, any rest)

    设定一个定时器。按照指定的周期(以毫秒计)来执行注册的回调函数

    参数

    function callback

    回调函数

    number delay

    执行回调函数之间的时间间隔,单位 ms。

    any rest

    param1, param2, ..., paramN 等附加参数,它们会作为参数传递给回调函数。

    返回值

    number

    定时器的编号。这个值可以传递给 clearInterval 来取消该定时。

    注意看最后一个参数说明,作为参数传给回调函数。

    参考这个函数说明,将代码修改如下:

    function a(that){
      var s=that.data.motto
      console.log(s)
      var len= s.length
      var s=s.substring(1,len)+s[0];
      that.setData({
        motto:s
      })
        }
    Page({
    data: {
        motto'Hello World',
      },
    onShow:function(){
        var that=this
      setInterval(a,300,that) //效果一样
      }
    })
    
    11-05
    赞同 1
    回复
  • Pt.
    Pt.
    11-04

    补充一下执行结果

    11-04
    赞同 1
    回复
登录 后发表内容