|
在学习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>
|