JavaScript变量

在学习JavaScript变量之前,我们得了解变量命名的规范。

  • 首字母必须是字母、下划线(-)或者美元符号($)组成。
  • 变量名是区分大小写,不能是关键字或保留字,不能以数字开头。
  • 遵守驼峰命名法,首字母小写,后面单词的首字母大写。例,myStyle

1.声明变量特殊情况

 第一种,我们直接去声明一个变量,但是不赋值,这样子会出现什么情况?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var momo;
        console.log(momo);
    </script>
</head>
<body>
    
</body>
</html>

控制台会显示出undefined的字样,及指出我们没有定义。

第二种,不声明变量,也不赋值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log(momo);
    </script>
</head>
<body>
    
</body>
</html>

像这样不声明,不赋值,直接使用变量控制台会显示报错。

第三种,不声明变量,直接赋值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        momo= 37;
        console.log(momo);
    </script>
</head>
<body>
    
</body>
</html>

像这种不声明,直接赋值使用。控制台会显示37,但是在实际的应用上我们是不推荐用这种写法。

2.JavaScript更新变量

JavaScript更新变量,用后面的变量覆盖前面的变量。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var myname='momo';
        console.log(myname);
        myname='joey';
        console.log(myname);
    </script>
</head>
<body>
    
</body>
</html>

像这样有两个声明的变量,那最终控制台输出的是momo还是joey呢。这里的原则是后面的变量覆盖前面的变量,所以控制台最终输出的结果是joey。

3.JavaScript交换变量

JavaScript的交换变量我们可以理解为通过第三方进行角色的对换。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var t;
        var i='momo';
        var y='joey';
        t=i;
        i=y;
        y=t;
        console.log(i);
        console.log(y);
    </script>
</head>
<body>
    
</body>
</html>

首先先声明一个空的变量t,通过空的变量t实现i和y里变量的交换。

4.JavaScript声明变量及赋值

这是js普遍的声明变量及赋值方法。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var age;
        age=20;
        console.log(age); 
        var Myname='momo';
        console.log(Myname);
    </script>
</head>
<body>
    
</body>
</html>

5.JavaScript同时声明多个变量

按照我们上面的方法,声明变量应该是下图那个样子。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
            var myname='momo';
            var myname1='joey';
            var myname2='maomao';
            var myname3='bobo';
            console.log(myname);
            console.log(myname1);
            console.log(myname2);
            console.log(myname3);
    </script>
</head>
<body>
    
</body>
</html>

但是我们同时声明多个变量的时候可以更加简便,使用逗号来隔开即可。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
            var myname='momo',
                myname1='joey',
                myname2='maomao',
                myname3='bobo';
            console.log(myname);
            console.log(myname1);
            console.log(myname2);
            console.log(myname3);
    </script>
</head>
<body>
    
</body>
</html>

  • 5
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

momo不会IT

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值