变量
变量的定义
变量就是存放数据的容器,我们通过变量名获取数据,数据可以修改
变量在内存中的存储
变量的使用
变量使用时分为两步:声明变量、赋值
声明变量
<!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>
//声明一个变量名称为a var是JavaScript中的一个关键字,意义是声明一个变量
var a;
</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>
//声明一个变量名称为a var是JavaScript中的一个关键字,意义是声明一个变量
var a;
//变量赋值
a = 10;
//在控制台输出变量a
console.log(a);
</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>
//声明一个变量名称为a var是JavaScript中的一个关键字,意义是声明一个变量
var a;
//变量赋值
a = 10;
//在控制台输出变量a
console.log(a);
//变量初始化
var tom = 666;
console.log(tom);
</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 name = '卡卡西';
var address = '火影村';
var age = 30;
var email = 'kakaxi@itcast.cn';
var money = 2000;
console.log(name);
console.log(address);
console.log(age);
console.log(email);
console.log(money);
</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 = prompt('请输入你的名字');
//输出变量
console.log(myname);
</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 age = 18;
console.log(age);
//更新变量
age = 20;
console.log(age);
</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 a = 1, b = 2, c = 3;
var c,
d,
e = 10;
</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>
//会出现undefined
var age;
console.log(age);
/* //使用没有声明没有赋值的变量会报错 如果报错的话,程序就不会向后执行了
console.log(tel);*/
//不声明直接赋值虽然没出错,但是不提倡
tem = 10;
console.log(tem);
tem = 20;
console.log(tem);
</script>
</head>
<body>
</body>
</html>
变量命名规范
这里注意:name不属于关键字,但是name在浏览器中通常有特殊含义,所以不要用这个变量名
案例一:交换
<!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 a = 1, b = 2, temp;
//利用temp做临时变量交换a b的值
console.log(a);
console.log(b);
temp = a;
a = b;
b = temp;
console.log(a);
console.log(b);
</script>
</head>
<body>
</body>
</html>