1.JS变量
与代数一样,JavaScript 变量可用于存放值(比如 x=5)和表达式(比如 z=x+y)。变量是用于存储信息的"容器"。
变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume)。
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
JavaScript 语句和 JavaScript 变量都对大小写敏感。
1.1 声明创建变量
在 JavaScript 中创建变量通常称为"声明"变量。
我们使用 var 关键词来声明变量,变量声明之后,该变量是空的(它没有值),如需向变量赋值,请使用等号。也可以在声明变量时对其赋值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JS简单学习</title>
</head>
<body>
<script>
var x=5;
var y=6;
var z=x+y;
document.write("x=" + x + "<br />");
document.write("y=" + y + "<br />");
document.write("z=" + z + "<br />");
</script>
</body>
</html>
1.2 重新声明变量
如果重新声明 JavaScript 变量,该变量的值不会丢失。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS简单学习</title>
</head>
<body>
<p>点击下面的按钮来创建变量,并显示变量的结果</p>
<button type="button" onclick="myFunction()">点击按钮</button>
<p id="demo"></p>
<script>
function myFunction() {
var hobby="sleep睡觉!!!";
var hobby; //重新声明变量,此时hobby变量的值仍为"sleep睡觉!!!"
document.getElementById("demo").innerHTML="hobby:" + hobby;
}
</script>
</body>
</html>
1.3 一条语句中声明多个变量
可以在一条语句中声明很多变量。该语句以 var 开头,并使用逗号分隔变量即可。声明也可横跨多行。
一条语句中声明的多个变量不可以同时赋同一个值。
var x,y,z=1; //x,y为undefined,z为1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS简单学习</title>
</head>
<body>
<p>变量x、y、z、country、sign可以拼接出如下结果,请点击按钮查看。</p>
<button type="button" onclick="myFunction()">按钮</button>
<p id="demo"></p>
<script>
function myFunction() {
var a; //声明变量a,但不给a赋值,变量a的值将是undefined
var x=600,y=66,z=x+y; //一条语句中声明多个变量
var country="中国",
sign="!!!"; //跨行声明多个变量
var str=document.getElementById("demo");
str.innerHTML=country + z + sign;
}
</script>
</body>
</html>
2.JS数据类型
值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。
引用数据类型:对象(Object)、数组(Array)、函数(Function)。
2.1 JS动态类型
JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS简单学习</title>
</head>
<body>
<script>
var s; //此时s为undefined
var s=20; //此时s为数字
var s="HTML"; //此时s为字符串
document.write("此时变量s的值为:" + s);
</script>
</body>
</html>
2.2 JS数字、字符串与布尔
字符串可以是引号中的任意文本。可以使用单引号或双引号。
JavaScript 只有一种数字类型。数字可以带小数点,也可以不带。极大或极小的数字可以通过科学(指数)计数法来书写。
布尔(逻辑)只能有两个值:true 或 false。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS简单学习</title>
</head>
<body>
<p>合理的对字符串和数字变量进行赋值</p>
<script>
var s1="huawei";
var s2='oppo';
var s3="My name is \"zhangsan\".";
var s4='My name is \'zhangsan\'.';
document.write(s1 + "<br />");
document.write(s2 + "<br />");
document.write(s3 + "<br />");
document.write(s4 + "<br />");
var x1=34.00,x2=34,y1=666e5,y2=666e-5;
document.write(x1 + "<br />");
document.write(x2 + "<br />");
document.write(y1 + "<br />");
document.write(y2 + "<br />");
</script>
</body>
</html>
2.3 JS声明变量类型(数组、对象)
当声明新变量时,可以使用关键词 "new" 来声明其类型。 JavaScript 变量均为对象。当您声明一个变量时,就创建了一个新的对象。
var carname=new String();
var x=new Number();
var y=new Boolean();
var cars=new Array();
var person=new Object();
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS简单学习</title>
</head>
<body>
<script>
var i;
var mobile=new Array();
mobile[0]="huawei";
mobile[1]="oppo";
mobile[2]="vivo";
for(i=0;i<mobile.length;i++) {
document.write(mobile[i] + "<br />");
}
document.write("<br />");
var person=new Object();
person={
name : "张三",
sex : "男",
hobby : "睡觉"
};
document.write(person.name + "<br />");
document.write(person["sex"] + "<br />");
document.write(person["hobby"] + "<br />");
</script>
</body>
</html>
2.4 JS的undefined和null
undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS简单学习</title>
</head>
<body>
<script>
var person;
var car="BYD";
document.write(person + "<br>");
document.write(car + "<br>");
var car=null
document.write(car + "<br>");
</script>
</body>
</html>