当前位置: 代码迷 >> 综合 >> Window setInterval() 方法详解,其中有的两个大坑:①当参数为code时,记得要用单引号括起来,否则代码只会执行一次。②单双引号歧义问题
  详细解决方案

Window setInterval() 方法详解,其中有的两个大坑:①当参数为code时,记得要用单引号括起来,否则代码只会执行一次。②单双引号歧义问题

热度:51   发布时间:2023-11-03 09:06:18.0

目录

1_语法:

2_当参数为code时,两个易踩得坑:

3_四种正确的常见写法

4_总结


1_语法:

setInterval(code, milliseconds); setInterval(function, milliseconds, param1, param2, ...)

参数 描述
code/function 必需。要调用一个代码串,也可以是一个函数。
milliseconds 必须。周期性执行或调用 code/function 之间的时间间隔,以毫秒计。
param1, param2, ... 可选。 传给执行函数的其他参数(IE9 及其更早版本不支持该参数)。

 

 

 

2_当参数为code时,两个易踩的坑:

1.当参数为code时,必须要单引号''把code扩起来否则代码只会执行一次。

正确写法(当参数为code时,code必须用单引号扩起来):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>setIntervalDemo</title>
</head>
<body>
<p>点击按钮,等待1秒,后台输出hello。1秒后会继续输出,如此循环下去...</p>
<button onclick="myFunction()">点我</button><script>
//正确写法
function myFunction() {setInterval('console.log("hello");', 1000);
}
</script></body>
</html>

错误写法(此时参数是code,但是code没有用单引号扩起来,所以代码只会执行一次):

//参数为code时,不加单引号,code只会执行一次
function myFunction() {setInterval(console.log("hello"), 1000);
}

hello只输出了一次

2.防止单引号或双引号在一句语句中同时出现两对而产生歧义,所以在console.log时,如果要输出字符串要单双引号混用。

错误写法:

//参数为code时,单引号或者双引号同时用会造成歧义报错,应该单双引号混用避免歧义
function myFunction() {setInterval('console.log('hello');', 1000);
}

点击按钮后板报错: 


3_四种正确的常见写法

共同的代码在(可<script>标签内加入代码):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>setIntervalDemo</title>
</head>
<body>
<p>点击按钮,等待1秒,后台输出hello。1秒后会继续输出,如此循环下去...</p>
<button onclick="myFunction()">点我</button>
<script>
//在此处加入代码
</script>
</body>
</html>

 1.参数为code时,写法1:参数是code,要给code加单引号,直接循环code内容,正确写法

// 参数为code时,写法1:参数是code,要给code加单引号,直接循环code内容,正确写法
function myFunction() {setInterval('console.log("hello");', 1000);
}

2.参数为code时,写法2:调用函数写法,注意此时是实际上参数是code而不是function,所以要给调用的function加单引号

//参数为code时,写法2:调用函数写法,注意此时是实际上参数是code而不是function,所以要给调用的function加单引号
function myFunction() {setInterval('myConsole()',1000);
} 
function myConsole() {console.log("hello")
}

3.参数为function时,写法1:调用函数写法,参数是匿名函数,不用加单引号

//参数为function时,写法1:调用函数写法,参数是匿名函数,不用加单引号
function myFunction() {setInterval(function(){ myConsole() },1000);
} 
function myConsole() {console.log("hello")
}

4.参数为function时,写法2:参数是箭头函数,不用加单引号

//参数为function时,写法2:参数是箭头函数,不用加单引号
function myFunction() {setInterval(()=>console.log("hello"), 1000);
}

以上四种写法都能实现每秒输出一次hello:


4_总结

1.setInterval()当参数为code时记得加单引号,否则代码只会执行一次,瓷碗还要注意单双引号歧义的问题。

2.setInterval()调用函数的其中一种写法, setInterval('myConsole()',1000)  实际上此时参数是code而不是function,也要加单引号,否则代码只会执行一次。

  相关解决方案