JavaScipt
运行在浏览器的编程语言
书写位置
- 内部
<body>
<script>
alert('你好')
</script>
</body>
- 外部
<body>
<script src="my.js"></script>
</body>
创建js文件，与img标签相似
- 行内
输入输出语法
输出
// alert('你好JS~')
// document.write('javascript我来了！')
console.log('她~会魔法吧~')
依次为：弹出警示框、文档输出内容、控制台打印输出
输入
prompt('请输入年龄')
变量
容器，装东西的盒子
// 声明变量
let age
// 赋值“=”
age = 18
alert(age)
// 声明同时进行赋值（初始化）
// let age = 18
// 变量更新
// age = 19
// document.write(age)
声明多个变量时，使用逗号隔开
命名规范和规则
规则
关键字(let、if、var)不能使用
数字不能开头
组成:字母、下划线、数字、$
- 注意-字母区分大小写
规范
有意义的名字
小驼峰命名-userName
常量
- 常量的值是无法改变的，也不能被重新声明
- 命名规范：和变量一致
// 常量
const PI = 3.14
console.log(PI)
不允许重复赋值，声明时必须赋值
数据类型
基本数据类型
number
整数、小数、正数、负数
// number
console.log(1 + 1)
console.log(5 % 2)
算数运算符：加减乘除取余
NaN: not a number
string
单引号、双引号、反引号包裹的数据（推荐单引）
// 字符串拼接
let age = 18
console.log('我今年' + age + '岁了')
// 模板字符串
console.log(`我今年${age}岁了`)
模板字符串:拼接字符串和变量，变量使用${}
boolean
true false
// boolean
let isCool = true
console.log(isCool)
console.log(typeof isColl)
console.log(3 > 4)
检测数据类型：typeof
undefined
// undefined
let num
console.log(num)
console.log(num + 1)
console.log(typeof num)
声明变量未赋值
null
// null
let obj = null
console.log(obj)
console.log(obj + 1)
赋值了但为空
引用数据类型
object对象、function函数、array数组
类型转换
隐式转换
// 隐式转换
console.log(2 + '2')
// 22
console.log('zhu' + '2')
// zhu2
console.log(2 - '2')
// 0
console.log(2 * '2')
// 4
console.log(+'123')
// 123
console.log(typeof +'123')
// number
-
加号两边有一个为string，则另一个也会转为string。zhu2
-
除‘+’外，减乘除均会把数据转化为number。0
-
'+'作为正号时可将字符串转为number。+'123'
-
任何数据与string相加均为string
显示转换
(严格大小写)
Number()-转为数字型
parseInt()-取整数
parseFloat()-浮点
// 显示转换
let str = prompt('数字')
console.log(Number(str) + 3)
// 案例
let num1 = +prompt('请输入第一个数字：')
let num2 = +prompt('请输入第二个数字：')
document.write(`两数相加的和为${num1 + num2}`)
// document.write(+num1 + +num2)
// document.write(Number(num1) + Number(num2))
// document.write(parseFloat(num1) + parseFloat(num2))
案例：用户信息订单
合并边框
table {
/* 合并边框 */
border-collapse: collapse;
height: 80px;
margin: 0 auto;
}