目录
一、JavaScript的初步使用
1.认识JavaScript
1.1JavaScript是什么
JavaScript是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。
1.2JavaScript作用
JavaScript作用:确定网页的行为交互(教网页做事情)
1.3JavaScript组成
ECMAScript——JavaScript的核心
ECMAScript 定义了 JavaScript 的语言规范
DOM——文档对象模型
一套操作页面元素的API
DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作
BOM——游览器对象模型
一套操作浏览器功能的API
通过 BOM 可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等
2.标签引用及书写位置
JavaScript 程序不能独立运行，它需要被嵌入 HTML 中，然后浏览器才能执行 JavaScript 代码。通过 script 标签将 JavaScript 代码引入到 HTML 中
2.1内部样式（内嵌式）
通过 script 标签包裹 JavaScript 代码
注意！：JavaScript 代码最好写在 body 标签内最下面,html是从上往下执行的若 script 标签没放在最下面，js加载完了html却还没加载，则会失效
<body>
<script>
alert("Hello,World!");
</script>
</body>2.2外部样式
一般将 JavaScript 代码写在独立的以 .js 结尾的文件中，然后通过 script 标签的 src 属性引入
<body>
<script src="./js/1.js">
//中间不要写内容
</script>
</body>2.3行内样式
<button onclick="alert('请点击我')">人外有人</button>οnclick=函数名+() 调用事件
3.注释和结束符
3.1单行注释
使用 // 注释单行代码
快捷键 Ctrl + /
3.2多行注释（块注释）
使用 /* */ 注释多行代码
快捷键 Shift + Alt + A
3.3结束符
在 JavaScript 中 ; 代表一段代码的结束，多数情况下可以省略 ; 使用回车（enter）替代。
4.常用的输入和输出语句
4.1页面输出
document.write() 将数据显示到网页中，相当于给我们的body标签添加内容
<body>
<script>
document.write('我是div标签<br>')
document.write('<strong>人才</strong>')
</script>
</body>
4.2提示输出框
alert() 在网页弹出一个提示框
<body>
<script>
alert('人外有人，天外有天')
</script>
</body>
4.3控制台输出
console.log() 在控制台输出语句，给程序员进行调试使用
<body>
<script>
console.log('来个人打赏点小钱钱吧')
</script>
</body>
4.4弹窗输入框
prompt() 在网页弹出一个输入确认框
<body>
<script>
prompt('请输入您要打赏的小钱钱')
</script>
</body>
4.5弹窗确认框
confirm() 在网页弹出一个确认框
<body>
<script>
confirm('你要打赏小钱钱？')
</script>
</body>
二、基础语法
1.命名规范（标识符）、字面量、变量和常量
1.1变量命名规范
关于变量的名称（标识符）有一系列的规则需要遵守：
-
只能是字母、数字、下划线、$，且不能能数字开头
-
字母区分大小写，如 Age 和 age 是不同的变量
-
JavaScript 内部已占用于单词（关键字或保留字）不允许使用
-
尽量保证变量具有一定的语义，见字知义
注：所谓关键字是指 JavaScript 内部使用的词语，如 let 和 var ，保留字是指 JavaScript 内部目前没有使用的词语，但是将来可能会使用词语。
规范：
起名要有意义
遵守小驼峰命名法
第一个单词首字母小写，后面每个单词首字母大写。例 ： userName
1.2字面量
在计算机科学中，字面量（literal）是在计算机中描述 事/物 比如：
一个月有 30 天 30 就是数字字面量
'天外有天' 字符字面量
[] 数组字面量 {} 对象字面量 等等
1.3变量
变量就是计算机中用来存储数据的容器,它可以让计算机变得有记忆.简单理解变量就是一个装东西的盒子.
变量作用:用来存放数据.
声明(定义)变量有两部分构成：声明关键字、变量名（标识)，关键字是 JavaScript 中内置的一些英文词汇（单词或缩写），它们代表某些特定的含义，如 `let` 的含义是声明变量的，看到 `let` 后就可想到这行代码的意思是在声明变量，如 `let age;`
= 这个符号在JavaScript中被称为赋值运算符
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript 基础 - 声明和赋值</title>
</head>
<body>
<script>
// 声明一个年龄变量
let age
// 赋值，将 18 这个数据存入了 age 这个“容器”中
age = 18
console.log(age)
// 声明的同时直接赋值 变量的初始化
// let age = 18
</script>
</body>
</html>1.4 var 和 let 区别
在较旧的JavaScript，使用关键字 var 来声明变量 ，而不是 let。
var 现在开发中一般不再使用它，只是我们可能再老版程序中看到它。
let 为了解决 var 的一些问题。
var 声明:
可以先使用 在声明 (不合理)
var 声明过的变量可以重复声明(不合理)
比如变量提升、全局变量、没有块级作用域等等
1.5变量扩展存放——数组
数组 (Array) —— 一种将 一组数据存储在单个变量名下 的方式
声明语法： let 数组名 = [数据1,数据2,数据3,...,数据n]
let arr = []数组是按顺序保存，所以每个数据都有自己的编号
计算机中的编号从0开始
在数组中，数据的编号也叫索引或下标
数组可以存储任意类型的数据
<script>
let arr = ['人才1',123,'abc','人才2']
console.log(arr[2])
</script>
2.基本数据类型
基本数据类型:number(数字型) . string(字符串型). boolean(布尔型) . undefined(未定义型) . null(空类型)
2.1 Number(数字型)
即我们数学中学习到的数字，可以是整数、小数、正数、负数
<script>
let age = 18 //正整数
let price = 12.5 //小数
let num = -50 //负数
</script>NaN
NaN 代表一个计算错误。它是一个不正确的或者一个未定义的数学操作所得到的结果
! NaN不等于任何人 包括自己
NaN : not a number
2.2 String(字符串型)
通过单引号(' ') 、双引号（" ")或反引号(` `)包裹的数据都叫字符串，单引号和双引号没有本质上的区别，推荐使用单引号。
注意事项：
1. 无论单引号或是双引号必须成对使用
2. 单引号/双引号可以互相嵌套，但是不以自已嵌套自已(口诀:外双内单 或者外单内双)
3. 必要时可以使用转义符 `\`，输出单引号或双引号
<script>
let str = '小钱钱'
let str1 = "小钱钱"
// 反引号
let str2 = `中文`
console.log('天外有天'人外有人'')// 报错
console.log('天外有天"人外有人"')//正确
console.log('天外有天\'人外有人\'')//正确
</script>!书写小技巧
'${变量名}'
<script>
let test = 26
document.write(
`你的岁数是${test}岁`
)
</script>
2.3 Undefined(未定义型)
个人理解：定义一个变量未赋值 就是 underfined
let i
console.log(typeof i)
2.4 Null（空类型）
定义一个变量赋值为Null (空)
let num = Null2.5 Underfined 与 Null 的区别
(1)undefined 不是关键字，而 null 是关键字。
(2)undefined 和 null 被转换为布尔值的时候，两者都为 false;
(3)undefined 在和null 进行 == 比较时两者相等，全等于比较时两者不等
(4)使用Number()对undefined和null进行类型转换
(5)undefined本质上是window的一个属性，而null是一个对象；
(6)undefined 定义了还没赋值，null ，定义了并赋值为空
2.6 Boolean（布尔型）
布尔类型 boolean 只有2个固定的结果 true(真) false(假)
let num = true
console.log(num)
console.log(3 > 4)
console.log(3 < 4)
2.7检测数据类型——typeof运算符
使用typeof操作符可以用来检查一个变量的数据类型。
typeof 运算符 可以检测数据类型
typeof 变量 推荐使用
typeof (变量)实例检测
<script>
// typeof运算符 可以检测数据类型
// typeof 变量 推荐使用
// typeof (变量)
let num = 10
console.log(typeof num)
console.log(typeof (num))
let str = 'pink'
console.log(typeof str)
let bool = true
console.log(typeof bool)
let age
console.log(typeof age)
let obj = null
console.log(typeof obj)//object
//为什么检测null数据类型得到的是object？
//原因是因为js底层的语言设计缺陷所导致的，后期有相关开发人员提供解决bug的方案，但被js官方无情的拒绝
let num1 = prompt('请输入')
console.log(typeof num1)//string
</script>为什么检测null数据类型得到的是object？
原因是因为js底层的语言设计缺陷所导致的，后期有相关开发人员提供解决bug的方案，但被js官方无情的拒绝
！注意 pormpt() 输入后的检测的是字符串(String)类型
3.数据类型转换 ！重点
| 类型 | 值 | to String(转换为字符串) | to Number | to Boolean |
| Boolean | true | 'true' "true" `true` | 1 | true |
| Boolean | false | 'false' "false" `false` | 0 | false |
| Number | 0 | '0' "0" `0` | 0 | false |
| Number | 123 | '123' "123" `123` | 123 | true |
| String | '0' | '0' "0" `0` | 0 | true |
| String | '123' | '123' "123" `123` | 123 | true |
| String | '123abc' | '123abc' "123abc" `123abc` | NaN | true |
| Undefined | toString()方法报错 'undefined' "undefined" `undefined` | NaN | false | |
| Null | null | toString()报错 ‘null’ "null" `null` | 0 | false |
3.1隐式转换
加：当被作为拼接使用，两侧类型中的一侧有Sting类型时，会成为字符串拼接，拼接后的类型为String类型；当没有被解析为拼接使用时，一侧类型会被转变为
减、乘、除（- * /）：在对各种非Number类型数字进行运算时，会将非Number类型转化为Number类型
==(比较):
Boolean 和其他任何类型比较，Boolean 首先被转换为 Number 类型。
String和Number比较，先将String转换为Number类型。
null == undefined比较结果是true，除此之外，null、undefined和其他任何结果的比较值都为false。
3.2转换为String类型
将其他类型转化为字符串类型(Sting)类型，有三种toString()、String()、 拼串。
方式一：调用被转换数据类型的toString()方法，该方法不会影响到原变量，它会将转换的结果返回，但是注意：null和undefined这两个值没有toString()方法，如果调用它们的方法，会报错。
<script>
let num = 123
num = num.toString()
console.log(num)
console.log(typeof num)
</script>
方法二：调用String()函数，并将被转换的数据作为参数传递给函数，使用String()函数做强制类型转换时，对于Number和Boolean实际上就是调用的toString()方法，但是对于null和undefined，就不会调用toString()方法，它会将 null 直接转换为 “null”，将 undefined 直接转换为 “undefined”。
<script>
let a = 123
a = String(a)
console.log(a)
console.log(typeof a)
let b = undefined
b = String(b)
console.log(b)
console.log(typeof b)
let c = null
c = String(c)
console.log(c)
console.log(typeof c)
</script>
方式三：为任意类型进行 + ""
<script>
let a = 123
console.log(a)
console.log(typeof a)
a = a + ""
console.log(a)
console.log(typeof a)
</script>
3.3转换为Number类型
有三个函数可以把非数值转换为数值：Number()、parseInt() 和parseFloat()。Number()可以用来转换任意类型的数据，而后两者只能用于转换字符串。parseInt()只会将字符串转换为整数，而parseFloat()可以将字符串转换为浮点数。
方式一：使用Number()函数
String类型转换为 Number类型
纯数字类型的字符串会转变为数字
有非数字的内容会转变为NaN
Boolean类型转换为 Number类型
true 转为 1
false 转为 0
Null类型转换为 Number类型
null 转为 0
Undefined类型转换为Number类型
undefined 为 NaN
<script>
let test1 = new Boolean(true)
let test2 = new Boolean(false)
let test3 = new String("999")
let test4 = new String("999abc")
let test5 = null
let test6 = undefined
document.write(Number(test1) + "<br>")
document.write(Number(test2) + "<br>")
document.write(Number(test3) + "<br>")
document.write(Number(test4) + "<br>")
document.write(Number(test5) + "<br>")
document.write(Number(test6) + "<br>")
</script>
方法二：parseInt()只会将字符串转换为整数。
<script>
let num1 = "123"
let num2 = '123.456'
let num3 = '123abc'
console.log(typeof num1)
console.log(parseInt(num1))
console.log(typeof parseInt(num1))
console.log(typeof num2)
console.log(parseInt(num2))
console.log(typeof parseInt(num2))
console.log(typeof num3)
console.log(parseInt(num3))
console.log(typeof parseInt(num3))
</script>
方法三：parseFloat()可以将字符串转换为浮点数。小数点有000的数字，会直接去掉.000的
<script>
let num1 = "123.000"
let num2 = '123.456'
let num3 = '123abc'
let num4 = '123abc.0013'
console.log(parseFloat(num1))
console.log(typeof parseFloat(num1))
console.log(parseFloat(num2))
console.log(typeof parseFloat(num2))
console.log(parseFloat(num3))
console.log(typeof parseFloat(num3))
console.log(parseFloat(num4))
console.log(typeof parseFloat(num4))
</script>
3.4转化为Boolean类型
将其它的数据类型转换为Boolean，只能使用Boolean()函数。
使用Boolean()函数
记忆： ' ' 、0 、 undefined 、null 、false 、NaN 转换为布尔值后都是false, 其余则为 true
<script>
//转换为布尔类型 Boolean()
console.log(Boolean('')) //false
console.log(Boolean('abc')) //true
console.log(Boolean('abc123')) //true
console.log(Boolean('123')) //true
console.log(Boolean('0')) //true
console.log(Boolean('1')) //true
console.log(Boolean(null)) //false
console.log(Boolean(undefined)) //false
console.log(Boolean(NaN)) //false
console.log(Boolean(-2)) //true
console.log(Boolean(0)) //false
console.log(Boolean(1)) //true
console.log(Boolean(5.155)) //true
</script>
<!-- 记忆： ''、0、undefined、null、false、NaN 转换为布尔值后都是false, 其余则为 true -->
</body>
440
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
