如何让JS变量和字符串拼接后,是变量而不是字符串?
本文最后更新于 809 天前,其中的信息可能已经有所发展或是发生改变。

发现一个很有意思的问题,就是把变量与字符串或者数字拼接后类型变成了字符串,而并未执行其中的的 JavaScript 代码。

问题

<ul class="testList">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
<script>
    var testList = $(".testList li")
    var test0 = "变量0";
    var test1 = "变量1";
    var test2 = "变量2";
    var test3 = "变量3";
    for(var i=0;i<testList.length;i++){
      testList.eq(i).html("test" + i)
    }
</script>

输出结果:

显然这并不是想要的结果

解决 eval()函数

eval() [1] 函数可计算某个字符串,并执行其中的的 JavaScript 代码。

eval() [2] 是全局对象的一个函数属性。

eval() 的参数是一个字符串。如果字符串表示的是表达式,eval() 会对表达式进行求值。如果参数表示一个或多个 JavaScript 语句,那么eval() 就会执行这些语句。不需要用 eval() 来执行一个算术表达式:因为 JavaScript 可以自动为算术表达式求值。

如果你以字符串的形式构造了算术表达式,那么可以在后面用 eval()对它求值。例如,假设你有一个变量 x,您可以通过将表达式的字符串值(例如 3 * x + 2)赋值给一个变量,然后在你的代码后面的其他地方调用 eval(),来推迟涉及 x 的表达式的求值。

如果 eval() 的参数不是字符串, eval() 会将参数原封不动地返回。在下面的例子中,String 构造器被指定,而 eval() 返回了 String 对象而不是执行字符串。

<ul class="testList">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
<script>
    var testList = $(".testList li")
    var test0 = "变量0";
    var test1 = "变量1";
    var test2 = "变量2";
    var test3 = "变量3";
    for(var i=0;i<testList.length;i++){
      testList.eq(i).html(eval("test" + i))
    }
</script>

输出结果:

参考

[1]:JavaScript eval() 函数:https://www.w3school.com.cn/js/jsref_eval.asp
[2]:MDN JavaScript eval() 函数:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/eval

标题:如何让JS变量和字符串拼接后,是变量而不是字符串?
地址:https://xiaodongxier.com/271.html
作者:王永杰
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇