JavaScript基础2

数据类型转换：

布尔值转换只有false，"",undefined，null，0，NaN会为false其他的都会为true

比较运算符：> < >= <= == != === !==

结果：布尔值 ​ 隐式转换：默认，转为数字，在比较大小 ​ 特殊：1、如果参与比较的左右两边都是字符串，则是按位比较每个字符的ASCII码  ​ 0-9<A-Z<a-z<汉字：常识：汉字的第一个字：一：unicode号：4e00 - ascii：19968 ​ 最后一个字：龥：unicode号：9fa5 - ascii：40869

                2、NaN参与任何比较运算结果都为false，所以没有办法使用普通的比较运算来判断x是不是NaN
            !isNaN(x);
​
                3、undefined==null;为true
         区分：undefined===null;为false
         全等：=== - 要求数值相同，并且数据类型也要相同，不再带有隐式转换
                   !== - 不再带有隐式转换的不等比较
​
        重写String方法，看出==和===的区别
        function String(x){
            if(x===undefined){
                return "undefined";//return->返回，后面跟着的就是返回的结果
            }else if(x===null){
                return "null";
            }else{
                return x.toString();
            }

        }

逻辑运算符：

作用：综合比较，结果也是为布尔值 ​ 隐式转换：左右两边都会悄悄转为布尔值，再综合比较结果 ​ &&：全部满足，才满足 ​ 一个不满足，则不满足

    ||：全部不满足，才不满足
          一个满足，则满足
​
    !：颠倒布尔值
​
    特殊：短路逻辑：如果前一个条件，已经可以得出最终结论了，没有必要看后续
        &&短路：如果前一个条件满足，才执行后一个操作，如果前一个条件不满足，则不管后续操作
              目的：简化【简单的】分支：1、一个条件一件事，满足就做，不满足就不做：if(){} 2、【简单的】- 操作只能有一句话：多句操作导致我们以后维护项目时观看/阅读代码不方便，往往以后很多操作可能就只有一句话
              语法：条件&&(操作);
​
        ||短路：实现浏览器兼容性问题：二选一
            e=e||window.event;

位运算：

左移：m<<n，读作m左移了n位，翻译：m*2的n次方 ​

右移：m>>n，读作m右移了n位，翻译：m/2的n次方

赋值运算：

+= -= *= /= %= ++ -- 一句话完成两个操作，先计算，再赋值回去

++i 和 i++的区别？

单独使用时，放前放后无所谓，效果一样

但是如果参与了别的表达式，变量中的值都会+1 前++【返回的是加了过后】的新值 后++【返回的是加了过前】的旧值

三目运算：简化if...else... if...else if...else

语法：看条件满足否，满足则做操作1，不满足则做默认操作 ​

1、条件?操作1:默认操作; ​

2、条件1?操作1:条件2?操作2:默认操作

    特殊：
        1、默认操作不能省略，省略后会报错
        2、如果操作有多句话，还是推荐使用if分支，多句操作再同一行不方便以后维护

1、*自定义函数：也叫做方法，是需要预定义好的，以后可以反复使用的代码段

1、**创建函数并且调用：2种

1.声明方式创建函数：用一个关键字function做声明 function 函数名(形参列表){ 函数体; return 返回值; }

2.、直接量方式创建函数：函数名其实就是一个变量名
     var 函数名=function(形参列表){
            函数体;
            return 返回值;
        }
​
    return的本意：退出函数的意思
    只不过如果return后面跟着一个数据，会顺便将其返回到全局作用域中，但是只负责返回不负责保存！
    所以在调用函数时：如果有return，记得拿一个变量接住结果
    何时使用：如果你希望拿到函数的结果，以后还要做别的操作，就需要搭配上return
    
    调用函数：var result=函数名(实参列表);
​
2、作用域：2种
    1、全局作用域：全局变量和全局函数，在任何地方都可以使用
​
    2、函数/局部作用域：局部变量和局部函数，在【函数调用时内部可用】
​
    带来了变量的使用规则：优先使用局部的，局部没有找全局，全局没有就报错
​
    特殊：
        1、不要对着未声明的变量直接赋值：a=1;会导致全局污染
        3、哪怕没有写return，其实最后也有return值，只不过是一个return undefined，不喜欢undefined，默认return undefined
        4、return一般只会出现在函数的最后，而且只能出现一个
        5、往往前辈们提供的方法，底层都有一个return操作，前辈们觉得以后用这些方法的人，可能还需要拿着这个结果去做别的操作
​
3、声明提前：
    原理：
        在程序正式执行之前，
        会悄悄地将var声明的变量和function声明的函数，
        集中提前到当前作用域的顶部，
        变量比函数轻，
        但是赋值留在原地
​
4、按值传递：

两个变量之间进行赋值
    如果传递的是原始类型的值
        修改一个变量，另一个变量是不会受到影响到，其实是复制了一个【副本】给对象
​
    如果传递的是引用类型的对象：其实目前你已经学过了两个了，Array和Function，JS中不是原始类型就是引用类型
        修改一个变量，另一个变量其实也会受到影响，因为大家操作的其实是同一个【地址值】 - 浅拷贝
​

2、预定义全局函数：程序员可以直接使用的，全局（在任何地方都可以使用）

1、编码和解码：

问题：url中不允许出现多字节字符，如果出现会乱码 utf-8编码格式下，一个汉字，占3字节 解决：发送前，前端将多字节字符编码为单字节字符（数字、字母） 发送后，后端接住，然后将单字节字符解码为原文 

编码：var code=encodeURIComponent("正常文本");

解码：var 原文=decodeURIComponent(code); 

2、isFinite(num)：判断num是不是无穷大，true->有效数字，false->无穷大
    哪些会为false：NaN、Infinity、分母为0，所以有多个都为false，不能用来判断是不是NaN
​
3、牛逼的：parseInt/Float、isNaN、eval

3、分支结构：switch...case...：根据条件的不同，选择一部分代码执行 语法： switch(变量/表达式){ case 值1: 操作1; break; case 值2: 操作2; break; default: 默认操作; }

特殊：1、case的比较不带隐式转换的
           2、问题：默认只要一个case满足后，会将后面所有的操作全部做完
    解决：break;
    建议：每一个case的操作后都跟上一个break;
        有的地方也可以省略break：
            1、最后的一个操作default可以省略break
            2、如果中间多个条件，做的操作是一样的，也可以省略掉中间的操作
          3、default可以省略不写，如果条件都不满足的情况，则什么事都不会执行
​
面试题：if与switch的区别
​
    1、switch：好处：执行效率相对较高
           缺点：必须要知道最后的结果才能使用，case不能做范围判断
​
    2、if：好处：可以做范围判断
           缺点：执行效率相对较低
​
    开发时：用哪个都无所谓
    代码优化：尽量的将if换成switch

1、循环结构 1、var 循环变量=几; while(循环条件){ 循环体; 循环变量的变化; }

2、var 循环变量=几;
      do{
    循环体;
    循环变量的变化;
      }while(循环条件)
​
面试题：while和do...while的区别？
    除了写法上有区别，还有一个点：只看第一次
        如果第一次大家都满足，两者其实没区别
        如果第一次大家都不满足。while一次都不会执行，而do...while至少会执行一次
​
3、for(var 循环变量=几;循环条件;循环变量的变化){
    循环体;
      }
​
建议：优先使用for循环，不确定循环次数的时候再用while补充
​
4、终止循环语句：break;//退出整个循环
                 continue;//退出本次循环，还会继续做下一次

2、数组的基础：一个变量名可以保存多个数据

创建：2种 *1、直接量：var arr=[值1,....]; 2、构造函数方式：var arr=new Array(值1,....); //缺陷：new Array(3); - 创建了一个长度为3的空数组

访问：数组名[下标] - 某个元素
特殊：读取元素，下标越界 - 返回undefined
           添加元素，下标越界 - 在新位置添加元素，结果：不好的，下标不在连续 --- 稀疏数组，拿去遍历一手，一定会得到很多很多的undefined
​
三大不限制：
    1、不限制数组的长度
    2、不限制数组的类型
    3、不限制数组下标越界 - 不是好事
​
length的三个固定套路：
    1、向末尾添加元素：arr[arr.length]=新值;
    2、获取倒数第n个元素：arr[arr.length-n];
    3、缩容：删除倒数n个元素：arr.length-=n;
​
遍历数组：
    for(var i=0;i<arr.length;i++){
        arr[i];//当前次元素
    }
​
释放一个引用类型的对象：切记一定要看清楚这个对象有几个变量关联着，每个变量都要释放后才能真正的释放
    最好的方式就是封装为一个函数，因为函数中的东西，调用完毕都会自动释放
​

​
如何创建哈希数组：2步
    1、先创建一个空数组：var arr=[];
    2、添加自定义下标并且赋值：arr["自定义下标"]=新值;
访问：arr["自定义下标"];
​
遍历：把数组中的每一个元素取出来执行相同 或 相似的操作
问题：不能使用for循环去遍历关联数组，因为length失效了，关联数组的length永远为0，而且我们下标也不再是一个数字
*解决：for in 循环
    个人不爱称呼他叫做一个循环，因为不能设置从哪里开始到哪里结束，所有的操作都是自动的
语法：for(var i in 数组名){
    i;//自动得到每一个下标
    数组名[i];//当前hash数组中的元素了
           }
          既可以遍历hash数组，也可以遍历索引数组
​
JS中除了undefined和null不是一个对象，万物皆对象，而【一切对象的底层都是hash数组】
​
面试：hash数组的原理：
    hash算法：将字符串交给hash算法，会得到一个尽量不重复的数字，但是字符串的内容相同，那么得到的数字也一定是相同
    添加元素：将自定义下标交给hash算法，得到一个数字（地址值），把要保存的数据放进去了
    读取元素：将指定的自定义下标交给hash算法，得到一个和添加时完全相同的数字（地址值），通过这个地址值可以拿到当初保存的东西

3、数组的API：

其实就是前辈们提前定义好的一些函数，我们程序员可以直接使用，这些函数只有数组可用 1、数组 转为 字符串 var str=arr.join("自定义连接符"); 特殊： 1、如果没有传入实参，则和toString效果一致，默认都是用，隔开

        固定套路：
        2、无缝拼接
            var arr=["h","e","l","l","o"," ","w","o","r","l","d"];
            console.log(arr.join(""));
​
        3、将数组元素拼接为页面元素（数据渲染）
            var str="<option>"+arr.join("</option><option>")+"</option>";

​
        实现：二级联动：4个关键点
            1、必须使用二维数组，细分每一个城市，并且二维数组的顺序要和之前的一维数组对应
            2、select.οnchange=function(){}  -  状态改变事件：只有选中项发生变化时，才会触发
            3、select可以直接获取当前选中项的下标，而不需要自定义下标：select.selectedIndex;
            4、其实绑定事件，等号左边部分就是你的函数名
​
2、拼接数组：添加元素到末尾的新方式
    var newArr=arr.concat(值1,arr2....);
    特殊：1、此方法不会修改原数组，必须拿一个变量去接住结果（返回的一个新数组）
               2、哪怕拼接的是一个数组，悄悄的打散数组，单个添加
​
3、截取子数组：可能只想拿到数组中的某一部分
    var subArr=arr.slice(starti,endi+1);
    特殊：1、此方法不会修改原数组，必须拿一个变量去接住结果（返回的一个新数组）
               2、含头不含尾
               3、如果只传入了一个实参，则为从starti开始，到末尾
               4、如果两个实参都省略，则复制了一份 - 深拷贝！两者互不影响
               5、支持负数参数，-1代表倒数第一个，-n代表倒数第n个

以上的API都是不修改原数组的

以下的API都是修改原数组的

4、删插替：
    splice：
    删除：var dels=arr.splice(starti,n);//从starti位置开始删除n个元素
        特殊：返回的是你删除的元素组成的数组 - 有可能你删除的正好是你需要的
    插入：var dels=arr.splice(starti,0,新值1,....);
        特殊：1、原来starti位置的元素以及后续元素都会被向后移动
                   2、没有删除元素，也有返回值，返回的是一个空数组而已
    替换：var dels=arr.splice(starti,n,新值1,....);var dels=arr.splice(starti,0,新值1,....);
        特殊：删除的个数 和 插入的个数不必相同
​
5、翻转数组：arr.reverse(); 

1、另一些数组的API：

1、排序： 笔试中：手写冒泡排序：从第一个元素开始，依次比较两个相邻的元素，如果前一个>后一个，两者就要交换位置 for(var j=1;j<arr.length;j++){ for(var i=0;i<arr.length-j;i++){ if(arr[i]>arr[i+1]){ var m=arr[i]; arr[i]=arr[i+1]; arr[i+1]=m; } } }

    数组提供了一个排序API - 正是开发：
        语法：arr.sort();
        特殊：1、默认转为字符串，按位PK每个字符的unicode（ascii）
                   2、希望按照数字排序 - 升序
                arr.sort(function(a,b){
                    return a-b;
                })
​
                a是后一个数，b是前一个数
                如果a>b，就会返回一个正数，说明后一个数>前一个数
                如果a<b，就会返回一个负数，说明后一个数<前一个数
                如果a==b，就会返回一个0，说明后一个数==前一个数
                而sort的底层就能通过你返回的值来判断要不要帮你交换位置
​
                    3、希望按照数字排序 - 降序
                arr.sort(function(){
                    return b-a;
                })
​
    切记：以后网页中见到任何带有排序功能的特效，说明它的底层一定是数组，因为JS中只有数组可以排序，先排序再数据渲染
                
2、栈和队列：作用：添加元素和删除元素的新方式
    栈：一端封闭，只能从另一端进出 - 现实生活中较少，何时使用：希望使用到最新的数据的时候
    队列：只能一端进入，另一端出    -  现实生活中较多，何时使用：按照先来后到的顺序
​
    栈：
      开头入：arr.unshift(新值,....)
      开头出：var first=arr.shift();//一次只能删除一个，而且一定是删除的第一个元素，有可能删除的东西就是你需要的东西
​
      结尾入：arr.push(新值,...);
      结尾出：var last=arr.pop();//一次只能删除一个，而且一定是删除的最后一个元素，有可能删除的东西就是你需要的东西
      至少不会影响到其他人的位置
​
    队列：以上4个API是可以混搭的
       开头入：arr.unshift(新值,....)
       结尾出：var last=arr.pop();
​
       结尾入：arr.push(新值,...);
       开头出：var first=arr.shift();

2、二维数组：

数组的元素，又一次引用了一个数组 何时使用：你希望再一个数组内再次细分分类 如何使用： var nums=[ ["1",2,"3"], ["1",2,"3"], ["1",2,"3"] ];

访问：arr[r][c] - r代表行下标，c代表列下标
特殊：1、列下标越界，返回undefined
           2、行下标越界，返回报错，因为行下标越界已经得到undefined再加[]则报错
​
如何遍历：
    固定公式：外层循环遍历行，内层循环遍历列
        for(var r=0;r<peoples.length;r++){
            for(var c=0;c<peoples[r].length;c++){
                console.log(peoples[r][c])
            }
        }
​
总结：ES3提供的数组：
    1、数组的基础（创建、访问、添加、遍历、hash数组）
    2、数组的API（10个：join、concat、slice、splice、reverse、sort、push、pop、shift、unshift）
    3、二维数组

3、String的基础概念

什么是字符串：多个字符组成的【只读】字符【数组】！ 1、【只读】：字符串所有的API都不会修改原字符串，只会返回新的字符串。 2、【数组】：跟数组有相同点： 1、字符串可以使用下标获取某个字符 2、字符串可以使用length获取字符的长度 3、字符串可以遍历得到每个字符 4、字符串可以使用数组不修改原数组的API（concat、slice）

​
JS内置对象（引用类型）：11个
    String Number Boolean -> 包装类型
    Array Function Date(日期)  Math(数学) RegExp(正则：验证)
    Error(错误)
    Object(面向对象)
    Global(全局对象)：1、保存着全局变量和全局函数，只不过浏览器端/客户端/前端global被window代替了，以后我们学习Node.js后端语言的时候你会发全局真的是global
                      2、唯独window对象可以省略不写
​
    包装类型：专门封装原始类型的值，将原始类型悄悄的变成了引用类型的对象（属性和方法）
        为什么：前辈们觉得比如字符串经常会被我们拿来做一些操作，为了方便我们程序员，提供了包装类型，把字符串变成了一个对象，提供了我们一些操作字符串的属性和方法
         本身原始类型的值，不带有任何属性和方法，意味着不能使用.去做操作的
    何时使用：只要你试图使用.去操作原始类型的值的时候，包装类型就会悄悄出现
    何时释放：方法一旦调用结束，包装类型就会自动释放
​
    为什么undefined和null不能使用.，他们俩没有提供过包装类型（没有任何属性和方法）