01-变量
<!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>
// 1.声明一个age的变量
var age;
// 2.赋值 把值存入变量中
age = 18;
// 3.输出结果
console.log(age);
// 4.变量的初始化：声明一个变量并赋值，称为变量的初始化
// 变量赋值时，汉字和英文要加单引号，数字不需要加
var myname = 'pink';
console.log(myname);
</script>
</head>
<body>
</body>
</html>
02-变量案例
<!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 = '旗木卡卡西';
var adress = '火影村';
// 数字不需要加单引号
var age = 30;
var email = 'kakaxi@itcast.cn';
var gz = 2000;
console.log(myname);
console.log(adress);
console.log(age);
console.log(email);
console.log(gz);
</script>
</head>
<body>
</body>
</html>
效果展示
03-弹出用户名案例
<!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>
// 1.弹出一个输入框，提示用户输入姓名 存储到一个myname的变量里面
var myname = prompt('请输入您的姓名');
// 2.弹出一个对话框（警示框），输出用户刚才输入的姓名
alert(myname);
</script>
</head>
<body>
</body>
</html>
04-变量的语法拓展
<!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>变量的语法扩展</title>
<script>
// 1.更新变量
var myname = 'pink老师';
console.log(myname);
myname = '迪丽热巴';
console.log(myname);
// 2.同时声明多个变量
// var age = 18;
// var adress = '火影村';
// var gz = 2000;
var age = 18,
address = '火影村',
gz = 2000;
// 3.声明变量的特殊情况
// 3.1只声明不赋值 结果是undefined 未定义 程序也不知道里面存的是啥
var sex;
console.log(sex);
// 3.2不声明不赋值直接使用 会报错 报错后下面的值都不会再显示出来 所以需要注释起来
// console.log(tel);
// 3.3不声明直接赋值使用 110
qq = 110;
console.log(qq);
</script>
</head>
<body>
</body>
</html>
05-变量命名规范
<!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 app = 10;
var APP = 100;
console.log(app);
console.log(APP);
// var 18 age;不能以数字开头
// var var;因为var有特殊意义了，这个叫做关键字，不能作为变量名 for while if
// 尽量不要使用name作为变量名 以下什么都不会显示 也不会报错
console.log(name);
</script>
</head>
<body>
</body>
</html>
06-交换两个变量值
<!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>
// JS是一种编程语言有很强的逻辑性，就是实现这个要求的思路 先怎么做再怎么做
// 1.我们需要一个临时变量帮助我们
// 2.把apple1给我们的临时变量temp
// 3.把apple2里面的苹果给apple1
// 4.把临时变量里的值给apple2
// 声明一个临时变量为空
var temp;
var apple1 = '青苹果';
var apple2 = '红苹果';
// 把apple1给我们的临时变量temp 把右边给左边
temp = apple1;
// 把apple2里面的苹果给apple1
apple1 = apple2;
// 把临时变量里的值给apple2
apple2 = temp;
console.log(apple1);
console.log(apple2);
</script>
</head>
<body>
</body>
</html>
07-变量总结
<!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>变量总结</title>
<script>
</script>
</head>
<body>
<h4>1.为什么需要变量</h4>
<p>因为我们一些数据需要保存，所以需要变量</p>
<h4>2.变量是什么</h4>
<p>变量就是一个容器，用来存放数据的。方便以后我们使用里面的数据</p>
<h4>3.变量的本质</h4>
<p>变量是内存里的一块空间，用来存储数据</p>
<h4>4.变量的使用</h4>
<p>我们使用变量的时候，先声明变量，再赋值。</p>
<p>声明变量的本质是去内存申请空间</p>
<h4>5.什么是变量的初始化</h4>
<p>声明变量并赋值称之为变量的初始化</p>
<h4>6.变量的命名规范</h4>
<p>变量名要规范，见名知意-驼峰命名法</p>
<h4>7.交换2个变量值的思路</h4>
<p>先画图，再写代码。理清思路</p>
</body>
</html>
效果展示
