js基础总结 （之前第一天学习js基础的10000字+总结）
学习之余回头看了下自己之前的总结，给大家分享一下。因为之前word总结的，所以代码段是图片，望大家见谅。
DAY2---------------------------------------------
DAY3------------------------------------------------------------------
DAY4------------------------------------------------------------
DAY1------------------------
一、如何编写js
editplus常用快捷键：
1. ctrl+shift+n - 创建一个新的html文件
2. ctrl+c
3. ctrl+v
4. ctrl+x
5. ctrl+s 保存当前文件
6. ctrl+b 按照指定的浏览器打开该html文件
前端：网页开发（html+css+JavaScript），app开发，移动端开发，游戏开发，服务器开发，可视化数据开发等 python人工智能
JavaScript：实现网页交互的脚本语言
交互：用户输入数据->程序接收并处理数据返回处理结果
如何编写js：
- 通过浏览器窗口编写
- 通过html页面中的script标签内部进行JavaScript编写
- 通过通过script标签的src属性引入js文件
二、js代码运行顺序
js如何运行：
浏览器中包含2个引擎：
1. 内容排版引擎 - 解析html和css的
2. 脚本解释引擎 - 解释并执行JavaScript程序脚本语言的引擎
解释执行：默认都是自上而下逐行执行的
当页面加载完成后，修改id为box的div的内容- XX
1. 通过Dom（文档对象模型）的API查找到id为box的div元素对象
api: 应用程序接口
window.onload=function(){ // 当页面加载完成后，才执行事件处理函数中的操作
var box=document.getElementById("box");
console.log(box);// null - 空
box.innerHTML="小杨"; // 通过innerHTML属性修改元素对象的显示内容
三、 js的数据类型
JavaScript的数据类型：2类
1、原始数据类型：
string - 字符串
number - 数字
boolean - 布尔 true false
undefined - 所有仅声明，未赋值的变量的默认值！ - 空（修饰原始数据类型的空）
null - 空 （修饰对象的空）
*symbol
2、引用类型对象：
array（数组） function（函数） Math Date
四、js数据转换类型
数据类型转换 - 隐式转换：不需要程序员干预，js可以自动的完成类型转换
仅讨论算数计算时的隐式转换
1. 算数计算中，一切数据都默认转换为数字后，再做计算
boolean： true -> 1 false -> 0
null -> 0
undefined -> NaN -> not a number (不是一个数字)
一些数据不能转换为数字的话，则会转换为NaN
**NaN不等于，不大于，不小于任何值包括他自己
只要NaN参与的运算结果永远是NaN
NaN虽然表示不是一个数字，但是他本身属于number数据类型
- 在+运算中，只要碰到字符串，+就不再是+法运算符号了，而变成了字符串拼接符号了，导致另一个不是字符串类型的数据，会变成字符串类型数据
+ 做拼接作用时候 NaN也做拼接结果是拼接 不是NaN
五、 js数据类型转换
JS强制转换：程序员主动的调用专门的函数（API）执行数据转换
何时使用：自动转换的结果不是我们想要的结果的时候
任意-> string 2个API
x.toString() x不能是undefined或者是null
String(x) -> 相当于隐式转换 -> 万能转换方式
typeof(x) -> 返回的结果数据类型
String -》 Number：2个API
parseInt(str/num):从第一个字符开始，依次读取每个数字，只要碰到第一个非数字字符就停止，自动跳过开头的所有空字符（使用较多 一般数值输入框都需要parseInt）
parseFloat(str/num):解析规则同parseInt,只不过认识第一个小数点
六、 JavaScript中的运算符
1. 算数运算：
+ - * / %(模运算) ++（递增1） --（递减1）
模运算 - %不取商而是取余数
比如： 3/2 = 1.5
3%2 = 1
模运算的2个用途：
1. 判断是否能整除：比如判断奇偶性
n%2等于0 n为偶数
不等0 n为奇数
2. 保证运算结果不能超过除数
++ 递增1 -- 递减1
有2种表达式：
++n
n++
这两个表达式的共同点都是将n中的值递增1后，再存回n中
如果上述2个表达式参与输出了，那么是有区别的
++n 返回表达式的新值（n递增后的值）
n++ 返回表达式的旧值（n递增前的值）
2. 关系运算：
将两个值作比较 -> true false
> < >= <= == != ===（全等比较）
关系运算的比较规则：
1. 默认将所有类型转换为数字后，再做比较
2. 如果参与比较的两个数据都是字符串
依次取出每个字符串中的字符 PK "unicode"号
3. 扩展赋值运算： += -= *= /= %=
比如：n=n+m 将n中的值递增m后，再存回n中
n=n+m --> n+=m
n=n-m --> n-=m
注意：n=m-n 能否简化成 n-=m? 不能！
DAY2---------------------------------------------
一、js的逻辑运算
逻辑运算：将多个关系运算综合起来，得出一个结论（true，false）
3种： &&(且) ||（或） !（非）
&&:2个条件都必须为true，才返回 true
||:2个条件都必须为false 才返回 false
短路逻辑(分支结构)：
&&：如果前一个条件为false，就已经得出结论->false
||: 如果前一个条件为true， 就已经得出结论->true
引申出短路逻辑：
语法：1. 条件&&(操作)
条件满足，执行后续操作，不满足，则不执行
2. 值1||值2
如果值1有效，就用值1，否则，就用值2
程序中的3种结构：1. 顺序结构
2. 分支结构：根据不同的条件，满足条件就执行，不满足就不执行
3. 循环结构
二、js的三目运算
根据不同的条件，执行不同的操作/返回不同的值
语法：
条件1?值1或操作1: // 满足条件1才取值1或执行操作1
条件2?值2或操作2:
默认值或默认操作 // 上述条件都不满足则取默认值或执行默认操作
总结：多个条件，多件事，多选一执行 如果操作语句比较简单，建议使用三目运算
消费大于500打八折 与判断平年 闰年的三目运算书写
代码简单便捷
使用实例
三、js分支结构
3种：
1. if结构：
一个条件一件事，满足就做，不满足就不做
语法：
if(条件){
满足条件执行的操作
}
2. if..else结构：
一个条件2件事，二选一执行（类似于三目运算）
语法：
if(条件){
满足条件执行的操作
}else{
不满足条件执行的操作
}
3. if..else if..[else]
结构：多个条件多件事，多选一执行（也有可能什么都不做）
语法：
if(条件1){
满足条件1执行的操作
}else if(条件2){
满足条件2执行的操作
}[else{
上述条件都不满足执行的默认操作
四、js分支结构
switch case结构：
当条件都是*全等比较*的时候，才可以使用switch case结构
全等比较：不仅比较值，还比较数据类型
语法：
switch(表达式){
case 值1:
满足值1才执行的代码段
case 值2:
满足值2才执行的代码段
... .. :
.....................
default:
如果前面的值都不满足，执行默认操作
}
问题：经过运行我们发现switch case结构如果没有break关键词，那么会根据条件进入到满足的条件的case执行，并以此触发后续的所有case操作执行（包括default），所以，如果想要独立的执行分支，必须要在每个case之间添加break关键词
break:"终止"当前结构执行，并跳出结构
何时可以省略break关键词：如果上下两个case执行相同操作时
五、循环结构
循环结构：让程序*反复执行*同一段代码
循环三要素：
1. 循环条件：让循环反复执行的条件
2. 循环变量：循环条件中用于比较的变量
循环变量总是向着不满足循环条件的趋势进行迭代的
3. 循环体：循环内反复执行的代码段
循环分类：
1. while循环：先判断循环条件，再执行循环体
一般情况下当循环条件的变化没有规律的时候优先使用while循环
while(循环条件){
循环体;
迭代修改循环变量;
}
2. do..while循环：先执行循环体，再判断循环条件
do{
循环体;
迭代修改循环变量;
}while(循环条件)
注意：while循环与do..while循环基本等效，区别在于看第一个循环条件是否满足
如果满足，则两者等效，不满足，while循环一次都不执行，而do while循环至少执行一次
DAY3------------------------------------------------------------------
一、for循环
for循环与while循环等效
语法：
for(1.初始化循环变量;2.循环条件;3.迭代修改循环变量){
4.循环体;
}
1->2->4->3->2->4->3
while(循环条件){
迭代修改循环变量;
循环体;
}
二、function定义
函数：程序中封装一项专门任务的步骤清单代码段
语法：
function 函数名([参数变量列表]){
任务步骤代码段;
[return 返回值;]
}
函数名（任务名）：指向函数定义的一个变量，保存的是*函数对象的引用*
声明的时候：不执行，同时也不读取内部代码
在程序的任意位置：函数名([参数值列表]);
函数调用时：才开始读取内部代码，并执行
三、变量作用域
变量作用域：一个变量的可用范围
2种：
1. 全局作用域 - window
全局变量 - 放在全局作用域里的变量可在程序的任意位置进行访问并修改
2. 局部作用域：
在函数调用的时候才会动态创建的作用域
局部变量：2种
1. 参数变量
2. 在函数中var出来的变量
***仅在函数调用时，动态创建
并且使用变量的规则是：如果局部有，就不用全局的
***调用后，局部变量会伴随着局部作用域一同销毁！
DAY4------------------------------------------------------------
一、函数的声明提前与按值传递
***声明提前：正式开始执行程序之前，都会先将var声明的变量，和function声明的函数，提前到当前作用域的顶部，集中声明，同时赋值留在本地
注意：函数的声明比变量的声明更置顶
二、数组
数组：一组变量的集合，连续保存多个数据的引用类型的对象
如何创建数组：
**1. 创建空数组 var 数组名=[];
暂时不知道数组内容的时候，先创建再追加
**2. 创建数组的同时直接初始化内容
var 数组名=[值1,值2,...];
3. 创建指定个数的数组
var 数组名=new Array(n);
创建一个数组对象，同时初始化n个空元素
4. 创建同时直接初始化
var 数组名=new Array(值1,值2,...);
注意：3,4创建数组方式不常用，因为有分歧
var arr=new Array(7);
可以解释为初始化了7个空元素 也可以解释为初始化了一个数组只放了一个元素值为7
数组分类：
1. 索引数组
下标从0开始每次递增1
length - 元素个数
索引数组的下标从0开始，每次递增1的特性
这个下标天生就是一个循环变量
下标递增到<length结束 - 循环条件
2. 关联数组（哈希数组）
下标可以自定义，而且下标不可重复
length - 失效
3. 二维数组 - 元素又指向另一个子数组对象
下标分为行下标和列下标，都是从0开始，每次递增1
行 - length获得数组中有多少个子数组对象
列 - length获得子数组中的元素个数
所有的数组都有下标！只不过每种数组下标特点不同
都有length属性，length属性表示数组的长度 - 保存了多少个元素
如何获得某个元素值： var 变量=arr[下标]
如何获得数组长度： arr.length
如何获得最后一个元素值：arr[arr.length-1]
undefined与null
1. 所有仅声明未赋值的变量的默认值 - undefined undefined为空 - 修饰原始数据类型
2. null - 修饰对象的空
null专门表示一个变量不再指向任何对象的地址了！
null的用法有2种：
1. var 变量 = null; - 打标记
表示将来该变量即将指向一个对象，只是此时什么都没有指向
2. var obj = 对象;
把该对象使用完毕后，就把obj主动赋值null - 》 obj=null
将来一个变量不再指向对象了，那么可以主动赋值为null
这么做得话，就表示主动的释放内存，节省内存空间从而提高浏览器性能 内存中有个垃圾回收器，如果一个对象没有变量指向（引用），那么就会被垃圾回收器回收，从而释放内存
js中的对象：内存中保存一组相关数据和功能的整体 对象都是new操作符创建的
new专门在内存中开辟一个空间，保存数据和功能，返回*存储地址*
三、数组遍历
冒泡排序：
将数组中的元素按照从大到小（从小到大）的顺序进行排列
四、关联数组
关联数组（hash哈希数组）- 可以自定义下标的数组
关联数组的key（下标）不可重复，length属性失效
如何遍历hash数组：
for(var key in obj){
console.log(obj[key])
}