介绍
轻量级的脚本语言,嵌入式语言
为什么学习JS
易学,广泛,能够操纵浏览器
Javascript和ECMAscript的区别
JS就是ES
JS的操作
引入JS文件
嵌入到html文件当中
<body>
<script>
</script>
</body>
引入本地独立JS文件
创建独立js文件,在HTML文件下body里面用script通过路径的方式引入js文件
<script src="./hello.js"></script>
引入网络文件
<script src="网络路径"></script>
引入之后,通过网页-检查-Network-All检查是否引入成功
JS的声明变量并赋值和重新赋值
<script>
var num = 10;
num = 20;
</script>
控制台输出
console.log(num)
undefined 未定义
注释
// 单行注释
/*
多行注释
*/
快捷键:ctrl+/
<!--文档注释-->
输出方式
1.页面出现一个弹框
alert("输出的内容")
2.直接显示在页面
document.write("内容")
3.控制台输出
console.log("控制台输出")
数据类型
六种数据类型
基础数据类型
var num = 20; //int
var name = "xxx" // string
var a = true; // boolean
引用数据类型
object对象
var user = {
name : "zhangsan",
age : 20,
gender : 18,
}
运算符
三元运算符
(条件)?表达式1 : 表达式2
条件成立输出表达式1,条件不成立输出表达式2
typeof运算符
输出typeof 对象名
可以判断对象的数据类型
算术运算符
加+
减-
乘*
除/
取余%
自增++x
自减--y
输出时,自增符号在前会先自增,再输出;
自增符号在后会先输出,再自增。同理自减。
赋值运算符
运算符 | 表达式 |
---|---|
= | 赋值 |
+= | x=x+y |
-= | x=x-y |
*= | x=x*y |
/= | x=x/y |
%= | x=x%y |
比较运算符
比较两个值的大小,返回布尔值
“<”、“>”、“<=”、“>=”
"=="
比较的是两个值的大小
”===“
比较的是两个值的大小和数据类型
“!=”
和"!=="
同理上述
布尔运算符
或”||“
且&&
非!
对于非布尔值取反,运算符会将其转化为布尔值再取反
以下六个值取反均为true,其他均为false
undefined
null
false
0
NaN
空字符串(“”)
If条件语句
var num = 10;
if(num > 1){
console.log("nb");
}
If…else语句
var num = 10;
if(num > 10){
console.log("nb");
}else {
console.log("666");
}
可以有多个if else
if else可以多层嵌套
Switch语句
var num = 5;
switch(num){
case 1:
console.log("数字一")
break;
case 2:
console.log("数字二");
break;
case 3:
console.log("数字三");
break;
case 4:
console.log("数字四");
break;
default:
console.log("反正不是一二三四");
}
一个case一个break,break会跳出语句。
循环语句
for循环
for(var num = 1; num <= 100; num++ ){
console.log(num);
}
九九乘法表
for(var i = 1 ;i<10 ;i++){
for(var j = 1 ;j<=i ;j++){
document.write(i + "*" + j + "=" + i*j);
document.write("   ")
}
document.write("<br>")
}
while循环
var a = 1;
while(a<=100){
console.log(a);
a++;
}