JS基础包括：JS简介、变量、常量、数据类型、数据类型转换、运算符和表达式。
大家都知道前端的三大语言：HTML、CSS、JS。HTML：专门编写网页内容。CSS：专门编写网页样式。JS：专门编写网页交互行为。所以，对于一个网页来说，JS是网页的灵魂，是重中之重。JS典型的用途：1、客户端表单验证 2、客户端数据计算 3、客户端动画效果。
目录
JS简介
JS由哪些部分组成
JS由 ESMAScript、DOM、BOM
ESMAScript：ECMA制定的JavaScript语言国际标准 规定JS语言的核心语法
DOM：专门操作网页内容的程序标准
BOM：专门操作浏览器窗口的程序
JS语言特点
1、运行在脚本解释引擎中
脚本解释引擎：专门解析js语言，并执行js程序的小软件
1、浏览器自带脚本解释引擎
浏览器包括了两个小软件：
内容排版引擎：专门解析HTML和CSS，并显示网页内容和样式的小软件。
脚本解释引擎：专门解析JS
2、独立安装的脚本解释引擎 Node.js
2、解释执行
边解释边执行，后解释的相同内容会覆盖先解释的
3、弱类型
声明变量时，不必提前规定变量的数据类型。 一个变量，先后可保存不同类型的数据
4、基于对象：CORE
如何使用JS
1、页面中的script标签里 一旦进入script标签内，就要使用js的语法
问题: 不符合内容与行为分离的原则——不便于维护和共用
2、独立的js文件中：引入： <script src="js文件的url"></script>
注意：script标签不同同时引入外部js和包含内部js。——结果：内部js自动失效
基本语法
1、向页面中添加内容 document.write("html代码段");
问题：向页面中随意输出内容会破坏页面的布局
解决: 调试程序时，不轻易使用document.write
2、弹出对话框 alert("提示消息");
问题：浏览器预定好的样式，不可修改
解决：对话框都用div+css模拟
3、向控制台中输出内容
控制台：console,专门用于调试程序，临时显示调试结果的小窗口
何时：只要调试程序，都要在控制台进行
如何：F12->console
console.log("Hello console!");
注意：每log一次，都自动换行
更多控制台操作：
1、编写多行代码：Shift+Enter 仅换行暂不执行
2、左上角圆形叉号: 清空控制台
3、调出刚写过的代码段: 上下键切换
输入：输入框 专门请用户输入一个数据的对话框
如何：prompt("输入提示");
变量
什么是变量
内存中存储一个数据的存储空间，再起一个名字
只要一个数据，可能被反复使用，都要先保存在变量中
如何使用变量
一个变量在使用前，必须先声明，才能使用
如何：var 变量名;
强调：一切变量都用var声明，不必提前规定数据类型
默认值：变量的默认值为undefined
undefined：专门表示一个从未使用过的变量
命名规则：
1、字母，数字或下划线组成，不能以数字开头
2、不能使用保留字: js语言已经提前占用的有特殊意义的名字
3、见名知义
4. 驼峰命名：首字母小写，之后每个单词首字母大写
比如：backgroundColor listStyleType
简写：可用一个var同时声明多个变量, 用逗号分隔
var 变量1,变量2,...;
赋值：将等号右边的值保存入等号左边的变量中
如何：变量名=值;
强调： 1、只有等号才能改变变量中的值 2、 = 会覆盖变量中的原值 3、变量赋值前，必须先声明
特殊：给为声明过的变量赋值:
普通js模式下：自动创建新变量并保存值
ES5 严格模式：比普通js模式要求更严格的模式
规定：禁止给未声明的变量赋值
结果：报错: ReferenceError
如何启用：在script顶部插入"use strict"
简写: 声明同时就初始化变量的值:
var 变量=值;
强烈建议: 每个变量都要赋初值
var 也可声明并初始化多个变量:
var 变量=值, 变量=值, ...;
比如： var a,b=2; a：undefined b：2
取值：取出变量中的值做运算
如何：只要使用变量名，等效于直接使用变量中的值
特殊：试图从未声明过的变量中取值，会报错！ReferenceError
常量
常量就是一旦创建后，值不能改变的量
什么时候用到常量：只要一个变量的值创建后不希望被篡改
如何使用常量：
声明：const 常量名=值;
注意：声明常量时，必须初始化其值 常量名通常全大写
赋值：常量不允许赋值
普通模式：强行赋值，不报错，但也无法修改 ——静默失败
ES5 严格模式：将所有静默失败升级为错误
取值：常量的用法和普通变量完全一样
数据类型
什么是数据类型：数据在内存中的存储结构
不同的数据类型，擅长执行的操作不一样，就需要配套何时的存储结构，给操作提供便利
数据类型包括两大类：原始类型、引用类型
原始类型：值直接保存在变量本地的数据类型 包括5个：number string boolean null undefined
引用类型：值无法直接保存在变量本地的复杂数据类型
如何查询数据类型：typeof x 返回变量x中存储的数据的类型名
number类型
number类型：专门用于存储数字
什么时候会用到number类型：只要一个数值经常用于算术计算或比较时
注意：程序中不加引号的数值，默认就是number类型
存储结构：number类型的数值在内存中采用二进制存储
功能：n.toString(2) 将n中的数值转为内存中的二进制形式。
存储空间：整数 4字节, 浮点数 8字节 1字节 = 8位二进制
数值大小和存储空间，无关！
特殊: 舍入误差: 计算机中也有计算不尽的数值
原因: 底层二进制计算导致
解决: 四舍五入: n.toFixed(2) 将n按2位小数四舍五入
string类型
string类型：专门存储一串字符的数据类型
什么时候用到string类型：只要用于显示或记录一个数据，不用做计算和比较大小，都要用 " " 包裹
注意：只要程序中用 " " 包裹的自动就是string类型
存储结构：js中一切文字都是用unicode编码存储的
unicode编码：对全球主要语言的每个字编一个号原因是计算机只认数字，不认字符
如何查看： c.charCodeAt();查看变量c中字符的unicode号
存储空间：1个字母或数字 1字节 1个汉字 2字节
转义字符
转义字符：字符串中具有特殊功能的字符
什么时候用到转义字符：
1、如果字符串中包含和js语法冲突的 " ，' 等，都要用 \ 转义为普通字符
2、希望在字符串中插入某些特殊功能：\n 换行 \t 制表符
问题：路径: windows操作系统中的路径使用 \ 作为上下级分隔，结果 \ 会和js字符串中的转义字符混淆
解决：
1、\ 变为 \\
2、将 \ 换成 / ——最优
boolean类型
boolean类型：只有两个值的类型: true/false
什么时候用boolean类型：只要表示一个判断的结论时
undefined
空 由程序自动使用，给变量赋初值
null
空 让程序员主动清空一个变量的值
数据类型转换
数据类型转换：将不需要的数据类型，转化为需要的数据类型
数据类型转换有两种：隐式转换、强制转换
隐式转换：不需要程序员干预，由js自动完成的数据类型转换
什么时候进行隐式转换：只要给定的数据类型和js程序需要的类型不相符，js就会根据自己的需要，自动转化数据类型
比如：算数计算中:
默认：一切都转为number类型，再做计算
原因是因为number类型最适合计算
bool：true = 1 false = 0
特殊：+ 运算中，只要碰到一个字符串，那么一切都转为字符串，+ 运算变为字符串拼接
强制转换：程序员主动调用函数完成的数据类型转换
其他类型转number
1、Number(x) 将x转为number类型
什么时候会用到Number(x)：都是隐式转换，其实相当于自动调用Number(x)，很少主动使用
缺点：只能转换纯数字组成的字符串和bool类型 如果转不了，就返回NaN
NaN：不是一个数字的任何值 Not a Number NaN参与任何运算结果只能是NaN
2、parseFloat/parseInt(str) 将str转为number类型，自动去除末尾非数字字符
parseFloat可保留小数部分 parseInt 去掉小数部分
什么时候会用到：只要将字符串转number，首选parseFloat 如果确实需要去掉小数，才选parseInt 如果转不了，也返回NaN
注意：参数应该是string类型，如果给定的值不是string类型，则先执行隐式转换，转为string类型，再转number
比如：parseFloat(true) parseFloat("true") -> NaN
其他类型转string
1、 x.toString() 将x转为字符串类型
x不能是null或undefined ——不是万能
2、String(x) 将x转为字符串类型——万能
隐式转为string时，都是自动调用String
其他类型转boolean
Boolean(x)
规则：只有5个值会被转为false： 0 , " " , NaN , null , undefined 其余都转为true
其实, 隐式转为boolean时，都是自动调用Boolean(x)
运算符和表达式
程序是人的想法在计算机中的执行
运算符：程序中模拟人的想法的特殊符号
表达式：由数据，变量和运算符组成的完成一项单一任务的语句
算数运算：+ - * / %
%：模运算/取余数: 被除数/除数,不要商，要除不尽的余数部分
什么时候会用到：
1、取余数
2、判断能否整除
3、判断奇偶 判断偶数: 能被2整除 n%2==0 判断奇数: 不能被2整除 n%2!=0
隐式转换：
默认：都转number
特殊：+运算中,碰到字符串，都转字符串，+运算变为字符串拼接
舍入误差：计算机中，也有计算不尽的数值
解决：
1、按指定位数四舍五入：n.toFixed(2) 今后几乎所有显示钱数的地方都要toFixed(2)
2、存储：保存很长位数的小数: 0.39999999
关系运算：用两个值做比较，做判断 > < >= <= == !=
返回值：boolean
隐式转换：
默认：都转number
特殊：
1、两个值都是字符串, 则不再转数字，而是依次比较每个字符的unicode号
2、判断NaN:
NaN和任何值做 > < >= <= == 5种比较时，永远false
NaN和任何值做 != 比较时，永远是true
问题：NaN==NaN =>false 用普通的==无法判断NaN
解决：isNaN(num) 专门代替==，用来判断num是不是NaN
何时：只要判断是不是NaN，都用isNaN(num)
反用：判断一个值是不是数字: !isNaN(num)
3、区分null和undefined
问题：==比较时，会自动将undefined隐式转为null
null==undefined 结果是 null=null
解决： === 全等: 类型必须先相同，值再相等
其实===就是不带隐式转换的 ==
逻辑运算：将多个关系运算，综合起来得到最终结论 && 且 || 或 ！非
什么时候会用到：只要根据多个条件，综合得出最终结论时
条件1&&条件2...：
要求所有条件都为true，结果为true 只要一个条件为false，结果为false
条件1||条件2...:
只要一个条件为true，结果为true 除非所有条件都为false，结果才为false
! 条件: 颠倒条件的判断结果
隐式转换: 默认将每个条件都转为bool类型
短路逻辑: 如果前一个条件已经可以得出最终结论，则后续条件不再执行。
&&: 只有前一个条件为false时，后续条件才不执行
||: 只要前一个条件为true时，后续条件不再执行
利用短路：
1、简单分支结构: 1个条件，1件事，只有满足才做
如何：条件&&(操作)
运算符优先级: 优先级高的运算，先计算 改变优先级: 用()
2、实现默认值/备用值
如何：值1||值2
如果值1可以被转为true，就选择值1使用
如果值1不能转为true，就选择值2使用
位运算
1、左移/右移
1<<3=8 1左移3位 相当于1* 2的3次方
2<<3=2* 2的3次方=16
8>>3=1 8右移3位 相当于8/ 2的3次方
2、取整:
n^0 n|0 n>>>0 代替/简化Math.floor(n)
3、交换两变量的值
var a=3,b=5;
方法一: var t=b; b=a; a=t;
方法二: a+=b; b=a-b; a=a-b;
方法三: a^=b; b^=a; a^=b;
赋值运算
扩展赋值运算：对特殊赋值运算的简写
a=a+b 将a的值+b的值，再存回a中 ——将b的值累加到a上
可简写为a+=b;
a=a-b a-=b;
a=a*b a*=b;
a=a/b a/=b;
a=a%b a%=b;
更简化: 递增递减运算: 如果每次累加1/累减1
a+=1 -> a++
a-=1 -> a--
前 ++ 和后 ++：
1、如果单独使用, 前后都一样
2、如果参与到其他表达式中时
相同：变量中的值一定都会+1
不同：前 ++，返回+1后的*新*值
后 ++，返回未+1的*旧*值
例子：
var n=3;
console.log(n++ + ++n + n++);
console.log(n);//6
提示：所有表达式都是从左向右依次执行 如果前一个表达式修改了变量的值，则会影响后续表达式的执行。
787
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
