一.JavaScript介绍
1. JavaScript介绍 ）
1.1 JavaScript是什么?
- 是一种通常运行在浏览器中（运行环境）的编程语言;
- 可以用来实现人机交互效果，提供逻辑思维能力。
1.2 JavaScript作用 - 监听用户的行为，并让网页作出对应的反馈
- 网页特效（动画效果）
- 表单验证 (针对表单数据的合法性进行判断)
- 数据交互 (获取后台的数据, 渲染到前端)
- 服务端编程 (node.js)
1.3 JavaScript的重要性 - 前端的唯一脚本语言； Vue，react等框架语言都是基于js的；
1.4 JavaScript的组成 - ECMAScript 规范： 规定了JavaScript的语法
- Web APIs(可操作的实体对象) : DOM BOM
DOM： document object model 操作文档（浏览器帮我们实体化为了一个对象： document）
BOM： browser object model 操作浏览器（浏览器帮我们实体化为了一个对象： window)
2. JavaScript的书写位置
2.1 内部 JavaScript
规范：script 标签写在</body>上面
浏览器逐行解析,遇到script标签,会阻塞文档解析
原因一：如果JavaScript 期望修改其下方的 HTML，那么它可能由于 HTML 尚未被加载而失效
原因二：因为script可能会修改dom元素，那么继续解析文档没多大意义，为了提升性能，浏览器会阻塞文档解析
2.2 外部 JavaScript
script 标签中间无需写代码，否则会被忽略！
2.3 内联 JavaScript 不推荐
3. JavaScript注释
3.1 单行注释
- 语法: //
- 作用: //右边这一行代码会被注释
- 快捷键: Ctrl + /
3.2 块注释 - 语法: /* */
- 作用: 在/* */中间的内容被注释
4. JavaScript结束符
- 结束符为英文分号 ;
- 结束符可写可不写
- 换行符(回车)会被识别成换行符
- 为了风格统一,要么每句都写,要么都不写(按团队要求)
5.输出语法
常见的输出语法有 alert() , document.write() , console.log()
6.输入语法
输入语法: prompt('提示文字')
显示一个对话框，对话框中包含一条文字信息，用来提示用户输入文字，获取的输入内容是字符串
二. 变量
1.什么是变量
- 变量是计算机存储数据的"容器"
- 变量的作用是用来存放数据的
2.变量的使用
2.1变量的创建 --声明变量
语法: let 变量名
let是关键字
2.2 变量赋值
语法: 变量名 = 数据
2.3 变量声明赋值连写
语法: let 变量名 = 数据
let age = 18
2.4变量值的修改
语法: 变量名= 数据
let age = 1
age = 2
//变量值变为2 在页面中输出age 结果为2
document.write(age)
2.5 声明多个变量
语法: let 变量1 = 数据1 , 变量2 = 数据2 ---- 中间用逗号隔开
let name = '刘德华' , age = 18 , sex = '男'
2.6案例:交换变量值
需求:num1= 10 , num2 = 20 交换两个变量的值 输出 num1= 20 , num2 = 10
//声明两个变量并赋值
let num1 = 10 , num2 = 20
//声明一个临时变量,并将num2的值给temp temp的值为20
let temp = num2
//把num1 的值赋给num2 num2 的值为10
num2 = num1
//把temp 的值赋给num1 num1的值为20
num1 = temp
2.7 字面量：字面上（表面上看上去去的）； 所见即所得的 一个数据；
一眼看上去，就知道这个数据的 类型 和 值的大小
3.变量命名规则与规范
规则：必须遵守，不遵守报错
规范：建议，不遵守不会报错，但不符合业内通识
3.1 规则：
不能用关键字
关键字：有特殊含义的字符，JavaScript 内置的一些英语词汇。例如：let、var、if、for等
只能用下划线、字母、数字、$组成，且数字不能开头
字母严格区分大小写，如 Age 和 age 是不同的变量
3.2 规范：
起名要有意义
遵守小驼峰命名法
第一个单词首字母小写，后面每个单词首字母大写。例：userName
三.数据类型
js数据类型整体分为两大类: 基本数据类型,引用数据类型
1.数字类型(number)
JavaScript 中的正数、负数、小数等 统一称为 数字类型.
console.log("正数", +100);
console.log("小数", 1.23);
console.log("负数", -1.23);
2.字符串类型(string)
通过单引号（ ''） 、双引号（ ""）或反引号( ` )包裹的数据都叫字符串，单引号和双引号没有本质上的区别，推荐使用单引号
console.log('123');
console.log("321");
console.log(`彦祖`);
注意点:
- 无论单引号或是双引号必须成对使用
- 单引号/双引号可以互相嵌套，但是不以自已嵌套自已（口诀：外双内单，或者外单内双）
- 必要时可以使用转义符 \，输出单引号或双引号
字符串拼接
语法: 使用加号拼接字符串
document.write('我叫' + '刘德华')
//输出为 我叫刘德华
let name = '刘德华'
let song = '忘情水'
document.write(name + song)
//输出为 刘德华忘情水
模板字符串
用反引号包裹数据,${变量} 使用变量
let name = '刘德华' , age = 18
document.write(`我叫${name},今年${age}岁了`)
//输出 我叫刘德华,今年18岁了
3.布尔类型(boolean)
表示肯定或否定时在计算机中对应的是布尔类型数据。
它有两个固定的值 true 和 false，表示肯定的数据用 true（真），表示否定的数据用 false（假）
4. 未定义类型（undefined）
只声明变量，不赋值的情况下，变量的默认值为 undefined
使用场景:我们开发中经常声明一个变量，等待传送过来的数据。
如果我们不知道这个数据是否传递过来，此时我们可以通过检测这个变量是不是undefined，就判断用户是否有数据传递过来。
5. null(空类型)
null 表示 值为 空
null 和 undefined 区别：
- undefined 表示没有赋值
- null 表示赋值了，但是内容为空
null 开发中的使用场景：
官方解释：把 null 作为尚未创建的对象
6.检测数据类型
使用typeof 检测数据类型
四.类型转换
1.为什么需要数据类型转换
JavaScript是弱数据类型： JavaScript也不知道变量到底属于那种数据类型，只有赋值了才清楚。
坑： 使用表单、prompt 获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算。
通俗来说，就是把一种数据类型的变量转换成我们需要的数据类型
2.隐式转换
- 加号（+） 左右，只要有一个字符串，就吧另外一个值转化为字符串
- 除了+号之外的，算数运算符；会吧数据转化为数字
-
+号 可以作为正号解析
9.png
3.显式转换
3.1转换为数字型
语法: Number(数据)
- 如果字符串内容里有非数字，转换失败时结果为 NaN（Not a Number）即不是一个数字
- NaN也是number类型的数据，代表非数字
语法: parseInt(数据) - 只保留整数
语法: parseFloat(数据) - 可以保留小数
<script>
// 显式的转化
// 1. Number(数据)
console.log(Number("123")); //123
// 1.1 当数据不能转化为数字的时候，会返回 NaN
console.log(Number("abc")); //NaN
// 1.2 NaN 是一个数字类型
console.log(typeof Number("abc")); // number
// 2. parseInt(数据)
// 作用： 解析为 整数
// 不会 四舍五入
console.log(parseInt("1.57")); // 1
console.log(parseInt("-1.23"));
// 3. parseFloat(数据)
// 作用： 可以保留小数
console.log(parseFloat("1.22")); // 1.22
console.log(parseFloat("1")); // 1
</script>
3.2 转换为字符型
语法:
String(数据)
变量.toString(进制) 进制默认为十进制
