js的三种引入方式
行内引入 | <button οnclick="alert('你完蛋了');alert('玩不了一点')">点击</button> |
内嵌引入 | <script> alert('666666') </script> |
外链引入 | <script src="./02-index.js"></script> |
注意script标签存在src属性之后,其内部就无法再写js代码(须离/body上边)
对话框
警示框 | alert('你完犊子了') |
输入框 | prompt('请输入用户名:') |
控制台打印 | console.log('我是控制台显示的') |
页面打印 | document.write('我是即将显示在页面上的') |
变量
常用let
变量:代码运行时,存储数据的容器
变量名: var let(var存在变量提升,let不存在变量提升)
变量声明:let pwd
变量赋值:pwd = prompt("请输入密码:")
alert(pwd)
变量的初始化:let pwd = prompt("请输入用户名:")
变量的值可以重新赋值
pwd = 666
alert(pwd)
let关键字生命的变量不能重复声明
变量名的命名规范:
1、变量名只能由有效符号组成(大小写的字母、数字、下划线、$)
2、不能以数字开头
3、不能使用关键字或者保留字
4、变量名最好有意义,不要使用a,b,c这类的单词
5、变量名尽量遵循小驼峰命名法
userName user_name
6、类名采用大驼峰
UserName
undefined | 表示变量只声明,但是未进行赋值 |
常量
const声明的常量不能被更改(常量名称一般全用大写)
形如
const PI=3.1315926
alert(PI)
数据类型
数据类型分为基本数据类型和引用数据类型
基本数据类型:
1、数字类型 number
let a = 1
alert(typeof (a))
let b = 3.14 浮点型不精确
alert(typeof (b))
2、字符串数据类型(被单引号、双引号括起来的字符序列)
let str1 = '1234'
alert(typeof (str1))
let str2 = "1234"
alert(typeof (str2))
字符串的拼接
document.write("str1的值是:" + str1)
模板字符串 `ncdjc`
let str3 = `1234`
alert(typeof (str3))
形如
let userName = prompt("请输入用户名:")
let pwd = prompt("请输入密码:")
document.write(`用户名是:${userName},密码是:${pwd}`)
可以与html一起使用
document.write(`
<input type="text"><br>
<h1>wohsuasj</h1>
<p>cdkcdkcd</p>
`)
boolean | 布尔值 |
true | 正确 |
false | 错误 |
document.write(2 > 3)
算数运算符
- | 减 |
+ | 加 |
* | 乘 |
/ | 除 |
% | 取余 |
** | 幂次方 |
形如
alert(2 + 3)
alert(2 - 3)
alert(2 * 3)
alert(2 / 3)
alert(3 % 2)
alert(3 ** 3)
数据类型转换
1、Number() | alert(typeof (Number("123"))) |
2、parseInt() | 把数据尽可能的转换为整型 alert(parseInt("200px")) |
parseFloat() | 把数据尽可能的转换为浮点型 alert(parseFloat("333.222px")) |
3、+(在前面加一个+) | console.log(typeof (+"123")) console.log(typeof (+"false")) console.log(typeof (+"cmdckdcmdk")) |
toFixed() 小数点的位数 | let a = 3.1415926 console.log(a.toFixed(2)) |
toString() | let b = 20 console.log(typeof (b.toString())) |
String() | let b = 20 console.log(typeof (String(b))) |
+"" | 在前面加一个+"" |
转换为布尔值
let c = 0
console.log(Boolean(c))
比较运算符
==:会自动将"2"转换为2,然后再进行比较
console.log(2 == "2")
console.log(2 === "2");
赋值运算符
= | let a = 11 /a = 22 |
a += 1(a = a + 1) | console.log(a) |
a -= 3(a = a - 3) | console.log(a) |
a *= 2(a = a * 2) | console.log(a) |
a /= 2(a=a/2) | console.log(a) |
自加自减运算符
a++后加加的优先级小于赋值运算符,因此先进行赋值运算,在进行后加加
++a前加加的优先级高于赋值运算符,因此先进行前加加,在进行赋值运算
逻辑运算符
与(&&) | 两真为真,一假则假 |
或(||) | 一真则真,两假才假 |
非(!) |
单分支
if(条件){
条件成立时执行的代码
}
形如
用户输入用户名和密码,你去判断用户名是否是admin,
并且密码是否是123456,是,则弹出登录成功
let userName = prompt("请输入用户名:")
let pwd = prompt("请输Mima:")
if (userName === "admin" && pwd === "123456") {
alert("登陆成功")
}
双分支
if(条件){
条件满足时执行的代码
}else{
条件不满足时执行的代码
}
形如
用户输入年份,你返回该年是闰年还是平年
能被4整除但是不能被100整除,或者被400整除的年份是闰年 ,否则是平年
let year = +prompt("请输入年份:")
if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
alert("是闰年")
} else {
alert("是平年")
}
多分支
形如
let score = prompt("请输入成绩:")
if (score >= 90) {
alert("成绩优秀")
} else if (score >= 70) {
alert("成绩良好")
} else if (score >= 60) {
alert("成绩及格")
} else {
alert("你芭比q了")
}
三元运算符
条件?条件成立时执行的代码:条件不成立时执行的代码
形如
age > 18 ? alert("成年了") : alert("未成年")
转义字符
"i\'am "
switch多分支语句
形如
let week = prompt("请输入今天星期几:")
switch (week) {
case "1":
alert("今天星期一,猴子穿新衣~~~")
break(跳出)
case "2":
alert("今天星期二,猴子优点2~~·")
break
case "3":
alert("今天星期三,猴子去爬山~~~")
break
case "4":
alert("今天星期四,猴子要找事~~~")
break
case "5":
alert("今天星期五,猴子打老虎~~~")
break
case "6":
alert("今天星期六,猴子666~~~")
break
case "7":
alert("今天星期天,猴子要上天~~~")
break
default:
alert("你是猴子派来的救兵吗???")
break
}
或
switch (week) {
case "1":
case "2":
case "3":
case "4":
case "5":
alert("工作日");
break;
case "6":
case "7":
alert("休息日");
break;
default:
alert("你是猴子派来的救兵吧~~~");
break;
}