JavaScript 随意整理
08.11
# JavaScript 基础
### 编程语言
* 机器语言
* 汇编语言
* 高级语言
* 编译型
* 解释型
### JavaScript 发展
* ECMA3 确定了地位
* ECMA5
* ECMA6 (ECMA2015 ECMA2016 ECMA2017)
###客户端 JavaScript 组成
* ECMAScript (核心 基本语法)
* BOM (浏览器模型)
* DOM (文档对象模型)
###客户端 JavaScript 组成
* ECMAScript (核心 基本语法)
* BOM (浏览器模型)
* DOM (文档对象模型)
# JavaScript 基本语法
### 在HTML中的使用
* 使用 script 标签引入 js文件
* 把js代码写在 script 标签中
### JavaScript 注释
* 单行注释 // 注释
* 多行注释 /* 注释 */
### JavaScript 指令结束符
* 换行
* 分号
### JavaScript 的输出
* 控制台输出 console.log()
* 弹框输出 alert()
* 输出到页面 document.write()
# JavaScript 变量
### 直接量
###变量: 装数据的容器
### 变量的命名规则
* 不能以数字开头
* 有 数字、字母、下划线 组成
* 不能使保留字
###命名方式
* 小驼峰 userAge
* 大驼峰 UserAge
* 匈牙利 user_age
### 声明变量
var 变量名 = 值;
var var01=val,var02=value; //同时声明多个变量
# JavaScript 数据类型
### 原始类型
* Number 数字
* String 字符串
* Boolean 布尔
* Null 空
* Undefined 未定义
### 对象类型
* Date
* Array
* Object
* .....
### 检测函数
* typeof()
# Number类型
### 分类
* 整型 整数
* 浮点型 小数
### 直接量表示
* 十进制的整数或小数 19.9
* 八进制表示 010
* 十六进制表示 0x65
* 科学计数法 7e6
### 特殊的Number
* inFinity 正无穷
* -inFinity 负无穷
### 非数字值 NaN (not a number)
* 与任何数字进行计算 结果是NaN
* 跟任何值都不相等
### 数值函数
* isNaN() 判断是否是 NaN true/false
* isFinite() 是否无穷
# String 字符串
### 定义字符串
* 双引号
* 单引号
### 转义字符
\"
\'
\n 换行
\r 回车
\t 制表符Tab
\v 垂直制表符
\f 换页符
\b 退格符
\\
### 字符串连接符
* +
08.14
# 数据类型转换
### 自动转换(在某种运算环境下)
* Number环境
* String环境
* Boolean环境
### 强制类型转换
* Number()
* 字符串: 纯数字字符和空字符转为正常数字,其他NaN
* 布尔值: ture:1 false:0
* String()
* Boolean()
* 转换为false: 数字0, 空字符串, null 和 undefined
* 转换为true: 值表示有东西
* parseInt()
* 转换为整数
* 与Number的区别: 一数字开头的字符串, 不会转换为NaN
* parseFloat()
* 转换为小数或整数
* 与Number的区别: 一数字开头的字符串, 不会转换为NaN
# JS操作 HTML
### 事件
* onclick
### 函数
* 声明函数
function 函数名(){
代码;
}
* 调用函数
函数名()
### 获取元素
* document.getElementById("")
* js代码写在 html元素的后面
### JS 操作html元素的属性以及css数据
* 元素对象.属性名
* 元素对象.style.属性名
* css属性名用小驼峰命名法。 只有写在元素style中的css属性,才可以被获取
* innerHTML属性 获取或设置双标签内的内容
# 表达式
* 简单表达式; 变量、直接量
* 复杂表达式; 运算符与简单表达式的组合
* 函数调用表达式
# 运算符
### 算术运算符
* 加号运算符 +
* 减号运算符 -
* 乘号运算符 *
* 除号运算符 /
* 取余运算符(取模) %
* 负数运算符 -
* 正数运算符 +
* 递增运算符 ++
* 递减运算符 --
### 比较运算符
* 相等运算符 ==
* 不等运算符 !=
* 全等运算符 ===
* 不全等运运算符 !==
* 小于运算符 <
* 小于等于运算符 <=
* 大于运算符 >
* 大于等于运算符 >=
* in运算符
### 逻辑运算符
* 逻辑与 (并且) &&
* 逻辑或 (或者) ||
* 逻辑非 !
### 位运算符
* 按位与 &
* 按位或 |
* 按位非 ~
* 按位异或 ^
* 左移 <<
* 右移 >>
### 赋值运算符
* =
* +=
* -=
* *=
* /=
* %=
### 其他运算符
* 字符串连接符 +
* ,运算符
* typeof 运算符
* 比较运算符 表达式 ? 表达式1 : 表达式2
# 运算符优先级
08.15
# 分支结构 条件语句
### 单向分支
if (){
}
### 双向分支
if () {
} else {
}
### 嵌套分支
if (){
if (){
}
} else {
}
### 多项分支 if else if
if (){
} else if (){
} else if (){
} else {
}
### 多项分支 switch case
switch (表达式) {
case 值: 表达式; break;
case 值: 表达式; break;
case 值: 表达式; break;
case 值: 表达式; break;
}
# 循环结构
### while 语句
while (表达式) {
循环体
}
### do while 语句
do {
循环体
} while (表达式);
### for 语句
for (定义循环变量; 条件判断; 循环变量变化) {
循环体
}
# 跳转语句
* continue
* break
* return
# 其他语句
* debugger;
* with
* use strict 严格模式
08.16
# 函数
### 函数的优势
* 提高代码重用性
* 代码可读性
* 程序的可维护性
### 函数的组成
* 函数名
* 函数体
* 参数 (形参 和 实参)
* 返回值 (结束函数, 作为函数调用表达式整体的值)
### 函数的声明方式
* 关键字方式
function 函数名([参数列表]) {
函数体
}
* 表达式方式(匿名函数方式)
var 函数名 = function([参数列表]) {
函数体
}
* 构造函数方式
var 函数名 = new Function("参数", "函书体)
### 函的参数问题
* 形参和实参的数量
形参数量<实参数量 多余的 实参被忽略
形参数量>实参数量 没有赋值的形参会自动赋值undefined
* 参数的默认值
* ECMA6语法(不兼容IE) function 函数名(参数1, 参数2=默认值)
* 有默认值的参数要写在后面
* 有默认值的参数称之为可选参数
* 兼容处理参数默认值问题, 在函数体判断 参数值是否是undefined
* 可变参数数量的函数
* arguments
### 函数的作用域
* 全局变量 在函数外面定义的变量
* 局部变量 在函数里面定义的变量
* 在函数内,不使用var声明的变量时全局变量(不推荐使用,严格模式不允许)
### 递归函数
08.18
# 数组
### 数组的概念
* 数组是值的有序集合
* 数组中的每个值 称之为 元素
* 每个元素可以是任意数据类型的值
* 每个元素都有索引(下标)
* 元素的索引从0开始,按照顺序递增。 元素最大的索引 2^32-2
### 创建数组
* 直接量 `[]`
* 构造函方式 `new Array()`
### 读写数组中的元素
* 数组名[索引]
### 稀疏数组
* js数组的索引是连续的
* 没有连续的给元素赋值 , 没有赋值的元素会自动赋值 undefined
### 添加和删除 数组的元素
* 添加数组元素
* 指定索引来添加元素
* 把数组长度当做新元素的索引 `arr[arr.length] = value`
* 在数组的最后添加元素 push() `arr.push()`
* 在数组的前面添加元素 unshift() `arr.unshift()`
* 在数数组的任意位置添加元素 splice(index, 0, value)
* 删除数组的元素
* 改变数组的length属性 `arr.length -= 1; arr.length -= 2`
* 删除最后面的一个元素 pop()
* 删除数组的第一个元素 shift()
* 删除指定位置的指定个数的元素 splice(index, length)
### 数组遍历
* for 循环
* for in
### 多维数组
### 数组的方法
* join([间隔符号]) 把数组的每个元素拼接成一个字符串 返回字符串
* slice(start, end) 截取数组中的一部分, 返回一个新数组
* concat(arr, arr....) 合并数组. 返回一个新数组
* toString() 把数组转换为字符串
* reverse() 翻转数组 副作用
* sort() 排序 副作用
* push() pop() 副作用
* shift() unshift() 副作用
### 类数组对象
* arguments
* Elementcollection 元素的集合
document.getELementsByTagName()
element.getElementsByTagName()
### 作为数组的字符串
* 字符串具有部分数组特性
* 字符串也有length属性 获取字符串的长度
* 也可以通过[索引值] 取出字符串中的一个字符
08.21
# Object
###Object 的概念
* 对象可以看做是属性的无序集合
### 创建对象Object
* 直接量 {}
* 构造函数 new Object()
### 对象属性的操作
* 运算符 .
* 运算符 []
* 属性检测 in
* 删除属性 delete
### 方法
* 方法也是属性
### Object 遍历
* for in
* [] 运算符
###原型
08.22
# 原型
### 定义
* 每一个对象都有原型
* 原型仍然是一个对象
* 模拟实现面向对象的继承性
### 原型链
* 对象的原型还有原型
* 对象除了可以使用自有属性还可以继承原型上的属性
### 获取原型
* 对象.__proto__
* 构造函数.prototype
### 操作原型的属性
* 原型本身就是对象,同操作对象
### 判断属性是自有的还是原型继承的
* hasOwnProperty()
### ECMA5中创建对象并指定对象的原型
* Object.create();
# Boolean
### 创建方式
* 直接量
* 转换函数
* 构造函数
### 属性
* constructor
### 方法
* toString()
* valueOf() 返回原始值
# Number
### 创建方式
* 直接量
* 转换函数
* 构造函数
### 属性
* Number.MAX_VALUE
* Number.MIN_VALUE
### 方法
* toFixed() 保留指定位数的小数, 默认保留整数
* toExponential() 用科学计数法形式来表示
* toString() 转为字符串。 可以把十进制转换为任意进制的字符串
# String
### 创建方式
* 直接量
* 转换函数
* 构造函数
### 属性
* length 字符串长度
### 方法
* charAt(index) 返回指定位置的字符,可以用[]运算符代替
* charCodeAt(index) 返回指定位置的字符的编码
* String.fromCharCode() 把unicode编码转换为 字符
* concat() 连接一个或多字字符串,可以被+运算符代替
* indexOf() 返回字符(串)在字符串中第一次出现的位置
* lastIndexOf() 返回字符(串)在字符串中最后一次出现的位置
* substr(start [, length]) 截取字符串
* substring(start [, end]) 截取字符串
* slice() 同 substring
* split() 把字符串分割成数组 根数组方式 arr.join() 相反
* toUpperCase() 把字符串转换为大写
* toLowerCase() 把字符串转换为小写
* trim() 去除字符串两边的空格
* replace()
* match()
* search()
# Date
### 创建date
* 构造函数
### 方法
* getYear()
* getFullYear() 公元纪年
* getMonth() 从0开始
* getDay()
* getDate()
* getHours()
* getMinutes()
* getSeconds()
* getMilliseconds()
* getTime() 从1970年1月1日0时0分0秒 至今的毫秒数
* getTimezoneOffset() 与标准时区的偏移量单位是分钟
* getUTC.....
* set...
* setUTC...
* toUTCStirng()
### 时间戳
* 从Unix元年至今的秒数或毫秒数
* Unix元年 1970年
# Math
### 属性
* PI 圆周率
### 方法
* abs() 求绝对值
* sqrt() 求平方根
* pow() 求几次方
* max() 求最大值
* min() 求最小值
* round() 四舍五入取整
* floor() 舍一取整
* ceil() 进一取整
08.23
# 定时函数
### 多次定时
* setInterval()
* clearInterval()
### 单次定时
* setTimeout()
* clearTimeout()
# Array
### 属性
* length
### 方法
* concat()
* join()
* slice()
* reverse()
* push()
* pop()
* shift()
* unshift()
* splice()
* sort()
###ECMA5 新增的方法
* forEach()
* map()
* filter()
* every()
* some()
* indexOf()
* lastIndexOf()
08.24
# 内置对象 Function
### 属性
* length 形参的数量
### 方法
* apply()
* call()
* bind() ECMA5新增
08.25
# 正则表达式
### 定义
* 对字符串进行描述的
### 作用
* 表单验证
* 验证 邮箱/电话/邮编 ....
* WEB编辑器
* 爬虫、数据抓取、小偷程序
### 定义正则表达式
* 直接量
* 函数
* 构造函数
# 正则表达式基础
### 原子
* 正则表达式的最小组成单位
* 普通的字母、数字、符号 都是原子
* 转义字符
* 字符类
### 字符直接量(原子)
* 原子的重要组成
* 普通的字母、数字、符号
* \n
* \t
* \r
* \v
* \f
* \\
* \b 退格符
* \x00
* \u0000
### 字符类(原子)
* \d 数字 [0-9]
* \D 除了数字之外的字符 [^0-9]
* \w 数字、字母、下划线 [0-9a-zA-Z_]
* \W 除了数字、字母、下划线 之外的字符 [^0-9a-zA-Z_]
* \s 空白符 [\n\t\v\r\f ]
* \S 除了空白符之外的字母 [^\n\t\v\r\f ]
* . 除了换行外所有的字符 [^\n\r]
* [...]
* [^...]
* [\b] 匹配退格符
### 重复(对原子的数量修饰)
* + 表示前面原子出现1次或多次 {1,}
* ? 表示前面的原子出现0次或1次 {0,1}
* * 表示前面的原子出现0次1次或多次 任意次 {0,}
* {m} 前面的原子出现m次
* {m,n} 前面的原子出现m到n次
* {m,} 前面出现的原子个数m次以上
### 指定匹配的位置 (对原子位置的修饰)
* \b 单词边界
* \B 不是单词边界
* ^ 字符串开始边界
* $ 字符串结束边界
08.28
#### 边界的修饰
* 先行断言(正向预查) (?=)
* 负向先行断言(负向预查) (?!)
#### 选择修饰符
* |
#### 模式单元 ()
* 改变优先级
* 把多个原子当做一个原子
* 把模式单元匹配的内容暂存内存 (?:) 可以取消暂存内容
* 暂存内存的内容可以被反向引用
## 修饰符(模式修正符)
* i 正则表达式不区分大小写
* m 允许多行(换行被当做字符串结束符)
* g 全局匹配
# 正则的使用
### RegExp对象
* test() true/false
* exec() 数组/null
### String对象
* search() 匹配成功(第一次满足正则的位置) 匹配失败(-1)
* match() 匹配成功(返回数组 全局匹配影响) 失败(null)
* replace() 替换
* split() 把字符串分割为数组