• 前端复习之JavaScript(ECMAScript5)


    啦啦啦啦啦啦啦啦绿绿绿绿绿绿

     1 1.JavaScript:
     2        前段三大语言:HTML CSS js
     3     HTML:专门编写网页内容的语言
     4     CSS:专门编写网页样式的语言
     5     js:专门编写网页交互行为的语言
     6   原生js:不需要下载任何第三方文件就可以直接使用的js
     7     ECMAScript(ES):ECMA制定的JavaScript语言国际标准规定js语言的核心语法
     8     JavaScript:NetScape遵照ES标准实现的自己的js语言
     9     JScript:Microsoft遵照ES……
    10         DOM:专门操作网页内容的程序标准
    11     BOM:专门操作浏览器窗口的程序
    12    js语言四大特点:
    13     1.运行在脚本解释引擎中:脚本解释引擎:专门解析js语言并执行的小软件
    14          1.浏览器自带脚本解释引擎:内容排版引擎和脚本解释引擎
    15      2.独立安装的脚本解释引擎:Node.js
    16     2.边解释边执行,后解释的相同内容会覆盖先解释的  
    17     3.弱类型:
    18        声明变量时,不必提前规定变量的数据类型,一个变量先后可保存不同类型的数据
    19     4.基于对象:core

    1.使用

    1         1. 页面中的script标签里:
    2              一旦进入script标签内,就要使用js的语法
    3             问题: 不符合内容与行为分离的原则——不便于维护和共用
    4         2. 独立的js文件中:
    5             引入: <script src="js文件的url"></script>
    6           强调: script标签不同同时引入外部js和包含内部js。结果: 内部js自动失效

      2.变量

     1 var 变量1,变量2,...;;
     2       强调: 一切变量都用var声明,不必提前规定数据类型。
     3          默认值: 变量的默认值为undefined
     4       命名规则:
     5        1. 字母,数字或下划线组成,不能以数字开头
     6        2. 不能使用保留字: js语言已经提前占用的有特殊意义的名字
     7        3. 见名知义
     8        4. 驼峰命名: 首字母小写,之后每个单词首字母大写
     9 
    10         强调: 变量赋值前,必须先声明
    11     特殊: 给为声明过的变量赋值 
    12     特殊: 试图从未声明过的变量中取值,会报错!
    13     声明: const 常量名=值;
    14     强调: 声明常量时,必须初始化其值常量名通常全大写
    15     赋值: 常量不允许赋值
    16     普通模式: 强行赋值,不报错,但也无法修改
    17         ——静默失败
    18     ES5 严格模式: 将所有静默失败升级为错误!

    3.***数据变量:

     1       1. 原始类型: 值直接保存在变量本地的数据类型
     2              number  string   boolean   null    undefined
     3       2. 引用类型: 值无法直接保存在变量本地的复杂数据类型
     4           功能: typeof x 返回变量x中存储的数据的类型名
     5      number类型:其类型的数字在内存中采用二进制存储    1字节=8位二进制
     6           功能:n.toString(2) 将n的数值转为内存中的二进制形式(整数4字节 浮点数8字节)
     7           特殊:舍入误差(底层二进制计算导致)->四舍五入n.toFixed(2)n按2位小数四舍五入
     8      string类型:c.charCodeAt();查看C中的Unicode号
     9      boolean类型:只有两个值的类型: true/false
    10      undefined: 空 由程序自动使用,给变量赋初值。
    11      null: 空 让程序员主动清空一个变量的值

     4. ***数据类型转换:  

     1    弱类型: 
     2         1. 声明变量时,不用提前指定变量的数据类型
     3         2. 同一个变量先后可保存不同类型的数据
     4         3. js会根据自己的需要,动态转变数据的类型
     5    1. 隐式转化: 由程序自动完成,不需要程序员手动干预的类型转化
     6       只要所给的数据类型,不是程序想要的,程序自动将给定的数据转化为自己想要的类型
     7    2. 强制转换: 由程序员主动调用功能,执行的类型转换
     8       1. 强制转数字: 
     9             1. Number(x): 可将任意类型的数据,转化为number类型。
    10               问题: 只能转纯数字组成的字符串和bool
    11             2. parseFloat(str): 将str转化为数字,保留小数。
    12                      特殊功能: 可去掉数字*结尾*非数字字符。
    13               parseInt(str): 将str转化为数字,去掉小数部分,下取整。
    14               强调: parseFloat/Int的参数,要求是字符串。
    15                  如果给定的不是字符串,则首先隐式转为字符串,再转为数字。
    16              比如: Number(true) -> 1   parseInt(true) -> NaN  "true"->NaN
    17         总结: 只要转字符串,都用parseFloat
    18               除非去掉小数,才用parseInt
    19               Number(x),几乎不会主动使用
    20               因为隐式转换使用的其实就是Number
    21          如果转不了: 都返回NaN(NaN: Not a Number)
    22          代表一切不是数字的值NaN参与任何算数计算,结果依然是NaN
    23          补: 转二进制: n.toString(2) 10->2
    24                  parseInt(str,2) 2->10
    25       2. 转字符串: 2种: 
    26            x.toString() 将任意内容,转为字符串除null和undefined之外
    27            String(x)   将任意内容,转为字符串——万能
    28         总结: 今后,凡是转字符串,首选String(x)
    29       3. 转bool: Boolean(x);
    30            规律: 只有5个值会转为false: 0  ""  null  undefined  NaN
    31            其余都转为true!

       5. ***运算符:

     1  1.算数运算: + - * / %
     2     m%n:模运算-->1.判断能否整除  2.用来取余数
     3     隐式转换:
     4      默认: 一切都转为number,再计算
     5      特殊: +运算中,如果碰到字符串,则一切都转字符串,+计算变为字符串拼接
     6  2.关系运算: 做比较,做判断( 6种: > < >= <= == != 7     隐式转换: 
     8      默认: 一切都转数字,再比较
     9      特殊: 
    10        1. 如果两个字符串比较: 不再转数字,而是依次比较每个字符的unicode号大小
    11        2. null和undefined:
    12       如何鉴别: null vs undefined
    13            ===: 全等: 首先要求类型必须相同 ,其次值再相等
    14            !==: 其实就是全等的反义,可代替!=
    15                 强调: 只要比较undefined必须用===,其实===就是不带隐式转换的==
    16                 建议: 用===代替==
    17        3. NaN不大于,不小于,不等于任何值
    18        isNaN(num)
    19            num不是数字或无法转为数字,则返回true
    20            num是数字或可隐式转为数字,则返回false
    21    3.逻辑运算: 将多个关系运算综合得出最终结论
    22          短路逻辑: 如果前一个条件已经可以得出最终结论,则后续条件不再执行
    23            &&: 如果前一个条件为true,则后续条件继续执行
    24                如果前一个条件为false,则后续条件不再执行,直接返回false!
    25            ||: 如果前一个条件为true,则后续条件不再执行,  直接返回true
    26                如果前一个条件为false,则后续条件继续执行
    27    4.位运算: 了解
    28     1.左移右移
    29        m<<n :等效于: m*Math.pow(2,n) , 
    30        m>>n : 等效于m/Math.pow(2,n)
    31     2.下取整: 
    32         m^0
    33         m|0
    34        等效于Math.floor(m)
    35     3. 交换两变量的值: 3种: 
    36         1. var t=a; a=b; b=t; 通常鄙视不让用!(不允许声明第三个变量)
    37         2. a+=b; b=a-b; a-=b;
    38         3. a^=b; b^=a; a^=b; 最简单
    39    5.扩展赋值运算: 对计算+赋值的一种简写
    40      a=a+b; 可简化为 a+=b 称为累加
    41        a=a-b; 可简化为 a-=b
    42        a=a*b; 可简化为 a*=b
    43        a=a/b; 可简化为 a/=b
    44        a=a%b; 可简化为 a%=b

     6.***数组API:

     1  API: 应用程序编程接口(数组: 连续存储多个数据的存储空间——存储
     2                               并提供了操作数据的API——功能)
     3     1.转字符串: 2种:
     4       String(arr): 将每个元素转为字符串,并用逗号连接
     5                何时: 只关心内容,不关心格式——拍照,对比
     6       arr.join(“自定义连接符”): 将每个元素转为字符串,但是,可自定义连接符
     7                何时: 如果要求带格式的转化
     8                比如: 将单词拼接为句子: words.join("")
     9                     将字母拼接为单词: 错误: chars.join()  =>String(chars)
    10                                     正确: chars.join("")
    11                     将数组内容动态生成页面元素
    12             判断数组是空数组: 
    13                  错误: arr.length==0 因为还有new Array(n)这种仅规定个数的空数组
    14                  正确: arr.join("")===””
    15 
    16     2.拼接和选取: 
    17      *拼接: 将其它元素或其它数组,和当前数组拼接为一个新数组
    18         如何: var newArr=arr.concat(值1,值2,...,arr2,…)
    19         强调: 
    20        1.concat无法修改原数组,只能返回新数组。
    21             要想获得拼接后的新值,必须用变量接住新数组
    22        2.会自动打散数组参数为单个元素,再拼接
    23      *选取: 复制出数组中指定开始到结束位置之间的元素,组成新数组
    24         如何: var subArr=arr.slice(starti,endi+1);
    25           复制出arr中starti位置到endi为止的所有元素,组成新数组。
    26         强调: 1. 如果两个参数都是下标,则含头不含尾,结束为止总要+1
    27             2. 不修改原数组,仅复制出原数组的元素,组成新数组返回。
    28        简写: 
    29           1.省略第二个参数: arr.slice(starti)表示一直选取到结尾
    30          2.支持负数下标: 表示倒数第n个元素
    31           原本: arr.length-n可简写为: -n  ,其实,是slice自动用length-n
    32         3.省略第一个参数: arr.slice() 复制整个数组
    33 
    34     3.修改数组: 删除,插入,替换 —— splice
    35      *删除: arr.splice(starti,n) 删除arr中,starti位置开始的n个元素。
    36         其实, splice有返回值: 返回被删除的元素,组成的临时子数组
    37            因为,程序中删除的东西,可能还有别的用途
    38         如何: var deletes=arr.splice(starti,n);
    39         强调: 1. 直接修改原数组
    40               2. 不用考虑含头部含尾
    41         简写: 1. 省略第二个参数,表示到结尾
    42               2. 支持负数参数
    43      *插入: arr.splice(starti,0,值1,值2,…)
    44          在starti位置,插入值1,值2,…,原starti位置的被向后顺移
    45         强调: 不支持打散数组类型参数
    46           vs concat() 不同: 
    47           1.Concat不修改原数组,返回新数组
    48             Splice 直接修改原数组
    49           2.Concat可打散数组参数为单个元素
    50             Splice 不支持打散数组参数,而是住套间
    51           3.Concat只能在结尾添加
    52             Splice 可在任意位置插入
    53      *替换: arr.splice(starti,n,值1,值2,….)其实就是先删除,再插入
    54           强调: 1. 删除的个数和插入的个数不必一致,因为,数组不限制元素个数。
    55 
    56      *翻转: arr.reverse();
    <script>
            //slice截取
            var str="abcdefg";
            var arr=str.slice(1,3);//bc
            var arr1=str.slice(-1); //g
            console.log(arr);
            console.log(arr1);
            //concat()拼接
            var new1=str.concat(arr);//abcdefgbc
            console.log(new1)

            var arr2=['h','i','j','k','l','m','n']
            //splice(starti ,n)截取
            var arr3=arr2.splice(1,3);
            console.log(arr2+"----"+arr3) //h,l,m,n----i,j,k

            //splice(starti,0,值1,值2...)插入
            var arr4=['h','i','j','k','l','m','n']
            arr4.splice(1,0,1,2,3);
            console.log(arr4+"----") //h,1,2,3,i,j,k,l,m,n----

            // splice(starti ,n,值1,值2...)替换
            var arr5=['h','i','j','k','l','m','n']
            arr5.splice(1,4,1,2,3);
            console.log(arr5) //(6) ["h", 1, 2, 3, "m", "n"]
        </script>

      

    7.***排序:

     1   鄙视: 3大排序算法: 冒泡,插入,快速
     2      冒泡:     
     3         数组排序API: arr.sort();
     4     原理: 将每个元素都转为字符串,按字符串比较大小
     5     问题: 只能按字符串排序。无法按数字排序。
     6     解决: 自定义比较器函数: 
     7         专门比较任意两数大小的函数
     8         要求: 2个参数: a,b
     9            返回值: 如果a>b,就返回正数
    10                        a<b,就返回负数
    11                        a==b,就返回0
    12            函数体: return a-b
    13         何时: 只要希望按数字排序时,必须自定义比较器函数
    14       如何定义: function cmp(a,b){return a-b}
    15       如何使用: 将比较器函数作为参数传给sort函数
    16     arr.sort(cmp)
    17     强调: cmp后不要加(),因为不是立刻执行,而是传入sort函数内,被sort函数反复调用。
    18       降序排列: 
    19     只要颠倒比较器函数的返回值的正负即可
    20        比如: function cmp(a,b){return b-a}

     8.***栈和队列:

     1  Js中没有专门的栈和队列类型。都是用数组模拟的。
     2       只不过,控制了使用数组元素的顺序。
     3      何时: 只要希望按照特定的顺序使用数组元素时
     4 
     5     栈(stack): 一端封闭,只能从另一端进出的数组
     6       特点: FILO
     7       如何: 
     8       结尾出入栈:
     9            入栈: arr.push(值)  已入栈的元素下标不改变
    10            出栈: var last=arr.pop()
    11       开头出入栈: 
    12            入栈: arr.unshift(值) 已入栈元素的位置    往后顺延
    13           强调: 开头入栈的结果和结尾入栈的结果是首尾颠倒的
    14         出栈: var first=arr.shift();
    15 
    16     队列(queue): 只能从一端进入,从另一端出的数组
    17       特点: FIFO
    18       何时: 只要按照先来后到的顺序使用数组元素时
    19       如何: 结尾入: arr.push()
    20            开头出:var first= arr.shift()

    9.*** 二维数组: 

     1   什么是: 数组中的元素,又引用另一个子数组
     2      何时: 2种:
     3         要保存的数据,就是横行竖列的二维数据
     4         要对数组中保存的内容,进行更细致的分类时(保存上下级关系的数据)
     5      如何: 
     6       创建: 2种:
     7       先创建空数组,再添加子数组
     8       创建数组同时,初始化子数组
     9       访问: 数组[r][c]
    10         二维数组中每个元素的用法和一维数组中每个元素的用法,以及单个变量的用法完全相同。
    11           强调: 二维数组中行下标r不能越界列下标c 可以
    12       遍历: 外层循环控制行,内层循环控制列
    13        for(var r=0;r<arr.length;r++){
    14          for(var c=0;c<arr[r].length;c++){
    15             arr[r][c] //当前元素
    16          }
    17        }
    18         arr.index(值):在arr中找“值”的位置,如果找到返回下标i,否则返回-1
    19 *******
    20   1.Length属性:
    21       数组是对象:分装了一组数据,并提供了对数据操作方法
    22      .length属性:获得数组中的元素个数!=实际中的元素个数
    23      何时使用: 
    24          arr[arr.length-1]: 任意长度数组中的最后一个元素
    25          arr[arr.length]:向数组末尾追加一个新元素
    26          改小length的值,可删除末尾元素
    27   2.关联数组:可以自己定义下标名称的数组
    28         如何创建关联数组:
    29            Var fbb=[];
    30                    Key       value—>对儿
    31             fbb[“sname”]=”范冰冰”;
    32             fbb[“shx”]=91;
    33         如何访问关联数组:fbb[“sname”]
    34         关联数组中的length属性失效!
    35       关联(hash)数组:下标是不能重复
    36            优势:利用hash算法,精确定位某个下标的位置,不用遍历
    37       索应数组:下标自动分配,无意义,要按内容查找只能从头开始遍历
    38       遍历关联数组:
    39       For(var key in arr){
    40           Key,仅得到当前元素的下标
    41            arr[key],得到当前元素的值!
    42       }
    43 
    44   3.数组API
    45     1.arr to String:
    46       var str=arr.toString()?自动,逗号分离
    47       var str=arr.join(“连接符”)—>自定义连接符
    48          固定套路:1.将字符拼接为单词:arr.join(“”)
    49               2.将单词拼接为句子:arr.join(“ “)
    50      *优化:
    51         问题:频繁字符窜拼接造成内存浪费*
    52         解决:先将要拼接的字符串放入数组 最后,arr.join(“”)
    53         过程:Var arr=[“a”];  54               arr[arr.length]=”b”;  arr[arr.length]=”c”;
    55               1个arr 2个str    1个arr 3个str
    56                    [“a”,”b”,”c”]      arr.join(“”);
    57              Var str=“a”;     a
    58              str+=”b”;//3个    ab   b
    59              str+=”c”;//5个      abc   c
    60     2. 拼接和截取:原对象保持不变
    61        Var newArr=arr.concat(新值1,另一个数组,新值2…)
    62        Var subArr=arr.slice(starti[,endi+1]);
    63          第二个参数可省略,若省略表示从start一直取到结尾
    64          两个参数都可以取负值,就近使用下标 含头不含尾
    65     3.arr.splice():删除 插入 替换
    66     4.arr.reverse();
    67     5.专门比较两数字的大小
    68         Function compareNum(a,b){return a-b;}
    69           专门比较两字符串的大小
    70         Function compareStr(a,b){  
    71           if(a>b) { return 1; }
    72             else if(a=b){return 0;}
    73             else if(a<b){return -1}
    74         }
    75         Function compareStr(a,b){return a>b?1:a<b?-1:0;}
    76           Bubble(nums,compareNum);console.log(nums);
    77           Bubble(emps,compareStr); console.log(emps);
     1  ***函数对象作为参数
     2          Js中函数本质是一个对象
     3          函数名本质是指向函数对象的变量
     4     自定义sort方法的排序   arr.sort(比较器函数)
     5  ***String:字符串:多个字符组成的一个只读的集合(数组)
     6      凡是数组对象中,不修改原对象的API,字符串都能用!
     7        比如:slice indexof
     8        反例:push  sort  splice
     9  内置对象(javacsript)ES标准中已经定义好的,由浏览器厂商已经实现的对象
    10       11个:String Number Boolean 
    11          /Array Date Math RegExp
    12          /Error 
    13          /Function Object
    14          /Globel(全局Window)
    15 
    16  ***包装类型:临时封装原始类型数据,提供对原始类型数据的操作方法
    17     3种:String Number Boolean(不能new)
    18     函数调用完,包装类型自动释放
    19       原理:
    20          1. 尝试对原始类型的值调用功能时, 引擎会判断值的类型,
    21             然后创建对应类型的包装类型对象。
    22          2. 包装类型对象中封装要操作的值,并提供各种API
    23          3. 用值调用功能其实是调用包装类型的功能
    24          4. 功能执行完,包装类型对象自动释放
    25     比如: var n=345.678; n.toFixed(2)
    26                 //new Number(n).toFixed(2)
    27          var char=”张”; char.charCodeAt()
    28                 //new String(char).charCodeAt()

    10.****String API:

     1     1.大小写转换: 将字符串中的字母统一转为大写或小写
     2        何时: 不区分大小写时
     3        比如: 用户名,验证码,邮箱地址
     4        如何: str.toUpperCase() 转大写
     5              str.toLowerCase() 转小写
     6     2.获得指定位置的字符: 3种
     7           2.str.charAt(i) => str[i]   
     8           1. str[i] 倒数第二个:str[str.length-2]
     9           3.获得指定位置的字符的unicode号: str.charCodeAt(i)
    10           4.将unicode号再转回原文: String.fromCharCode(unicode)
    11     3.查找关键字的位置:2种:
    12         1.Var i=str.indexOf(“kword”[,starti]);
    13         2.Var i=str.lastIndexOf(“kword”[,starti]);查找starti左侧第一次出现关键字位置
    14                Starti默认等于0
    15 
    16        ***截取子字符串:
    17       1.str.slice(starti,endi+1)   eg: pid.slice(6,-5+1);
    18       2.str.substring(starti,endi+1) 同slice,
    19     仅不支持负数参数eg: pid.substring(6,pid.length-5+1);
    20       如果知道个数: str.substr(starti,n)
    21 
    22        ***检索关键词: 
    23      1. 检索一个固定的关键词出现的位置: 
    24          var i=str.indexOf(“关键词”,fromi)
    25       查找str中fromi位置之后的下一个关键词的位置
    26             fromi: 指开始查找的位置
    27              如果省略,默认从头开始找
    28           返回值: 如果找到,返回关键词第一个字的下标位置
    29                   如果找不到了,返回-1
    30           问题: 每次只找一个关键词的位置
    31                 无法自动找下一个
    32           解决: 循环调用indexOf
    33                 每次都要显式指定开始查找位置为本次找到位置的下一个
    34                 直到返回-1就退出循环
    35 
    36           查找最后一个关键词的位置:
    37              var i=str.lastIndexOf(“关键词”);
    38           查找str中最后一个“关键词”的位置
    39           问题: 只能查找一个固定的关键词
    40                 关键词稍微变化,就找不到
    41           解决: 正则表达式
    42     2.判断是否包含符合规则的关键词——支持正则
    43        var i=str.search(/正则/)
    44       查找str中第一个符合正则要求的关键词的位置
    45        如果找不到,返回-1
    46      问题1: 所有正则默认区分大小写
    47      解决: 只要在第二个/后加i,表示ignore
    48      问题2: 没有第二个参数, 永远只能找第一个
    49      问题3: 只能返回位置,无法返回关键词的内容
    50      解决: match
    51     3.查找所有关键词的内容或个数: 
    52        var kwords=str.match(/正则/ig);
    53      在str中查找所有符合正则要求的关键词
    54      返回值: 所有关键词组成的数组
    55                如果没找到,返回null!
    56      问题: 所有正则默认只匹配第一个符合条件的关键词
    57      解决: 在第二个/后加g, 表示global
    58      问题: 只能返回内容,无法返回位置!
    59     4.即查找每个关键词的内容,又查找每个关键词的位置: ?
    60 
    61          替换: 将字符串中找到的所有关键词,替换为指定的新内容
    62          包含2种:
    63            简单替换: 将所有关键词替换为统一的新值
    64           str=str.replace(/正则/ig,”新值”)
    65         强调: 字符串是只读数组,所有,所有API都无权直接修改原字符串,只能返回新字符串
    66             高级替换: 根据本次找到的关键词不同,动态选择不同的替换值.
    67           str=str.replace(/正则/ig,function(kword){
    68                 kword //可自动获得本次找到的关键词
    69                    return 根据kword的不同,动态选择不同替换值
    70                 })
    71           删除: 将关键词替换为””
    72 
    73           切割: 将字符串按指定切割符,切成多段子字符串
    74             简单切割: 切割符时固定的
    75                var substrs=str.split(“切割符”)
    76             复杂切割: 切割符不固定
    77                var substrs=str.split(/正则/)
    78             固定套路: 将字符串打散为字符数组: str.split(“”)  

     11.***正则表达式:

     1 验证字符串格式
     2     使用规则模糊查找多种关键词
     3     如何: 
     4       1.最简单的正则表达式,就是关键词本身
     5       2.字符集:
     6         什么是: 规定一位字符备选字符列表的集合
     7            何时: 只要一位字符上有多种备选字时
     8            如何:[备选字符列表]
     9             强调: 1. []不能随便加逗号和空格
    10                  2. 一个[]字符集只能限定一位字符的备选范围
    11         简写: 当备选字符中部分字符是连续的,可用-省略中间字符:
    12           比如: 一位数字[0-9]
    13                 一位小写字母[a-z]
    14                 一位大写字母[A-Z]
    15                 一位字母[A-Za-z]
    16                 一位汉字[u4e00-u9fa5]
    17         反选: 选择除了xxx都行: [^xxx]
    18       3.预定义字符集:
    19         什么是: 对常用字符集的最简化写法
    20            包括: 4个:
    21                  d  一位数字, 代替[0-9]
    22                  w  一位字母,数字或_, 代替[A-Za-z0-9_]
    23                  s  一位空字符: 空格,Tab,… …
    24                  .   一位任意字符(除了换行)——通配符
    25             D,W,s-?除了d,w或s--?了解
    26                  强调: 必须规则和预定义字符集的规则完全匹配时,才能使用预定义字符集。
    27                 问题: 字符集只能规定一位字符的备选内容无法灵活规定出现次数
    28         解决: 量词:
    29       4.量词: {min,max}灵活定义一位字符集出现次数的规则
    30          何时: 只要规定字符集出现次数
    31          如何: 2大类:
    32         1.有明确数量边界的:3个
    33             字符集{m,n} 至少m次,最多n次
    34                   字符集{m,}  至少m次,多了不限
    35                   字符集{m}  必须m次
    36         2.没有明确数量边界:3个
    37             字符集?  可有可无,最多一次{0.1}
    38                   字符集*  可有可无,多了不限{0,}
    39                   字符集+  至少一次,多了不限{1,}
    40           强调: 默认一个量词仅修饰相邻的前一个字符集
    41       5.选择和分组:
    42         分组: 将多个子规则用()包裹为一组
    43         为什么: 默认一个量词只能修饰一个字符集
    44         何时: 只要希望一个量词同时修饰多个字符集时
    45          选择: “规则1|规则2”  |读作或
    46               类似于程序中的或者
    47                     只要匹配任意一个规则即可
    48                例:身份证: 1,2,3代 15位数字  2位数字 
    49         最后一个可能是数字或Xx后三位整体可有可无,最多1次 
    50                   d{15}     (d{2}     [0-9Xx])?
    51               例:手机号: +86或0086  整体可有可无,最多一次
    52                   (+86|0086)?
    53              空字符      可有可无,多了不限
    54                    s*
    55                         1
    56              3,4,5,7,8中挑一个
    57               [34578]
    58             9位数字
    59               d{9}
    60             (+86|0086)? s*1[34578] d{9}
    61       6.指定匹配位置: 3个位置
    62            ^开始位置, 第一个字符之前
    63           $结束位置, 最后一个字符之后
    64           何时: 只要仅匹配特定位置的值时
    65          比如: 匹配空字符: 
    66               ^s+ 字符串开头的空字符
    67               s+$ 字符串结尾的空字符
    68               ^s+|s+$匹配开头或结尾的空字符
    69                专指单词边界: 
    70                 ^ $ 空格 标点符号
    71                     专门选择一个单词之用

      12.**RegExp

     1 什么是: 封装一条正则表达式,并提供使用正则表达式执行验证和查找的API
     2      何时: 2种:
     3         1.验证格式
     4         2.实现最高级的查找
     5     如何: 
     6       创建: 2种:
     7         1.使用直接量: var reg=/正则/ig;
     8         何时: 如果正则表达式是固定,无需动态拼接生成
     9         因为//之中不支持js表达式
    10         字符冲突: //之间出现特殊符号: + /等等,都要转义为+ /
    11         2.用new: var reg=new RegExp(“
     	正则”,”ig”);
    12         何时: 如果正则表达式需要动态拼接生成(所有都要改为\)
    13              字符冲突: \ 或 “ 都要转义为\  ”
    14         正则API: 2个:
    15         1.验证格式: var bool=reg.test(str)
    16         验证:str是否符合reg的正则规则(要求从头到尾必须完全匹配)
    17                 符合返回true,不符合返回false
    18               问题:(test方法默认只要找到部分匹配,就算验证通过。
    19               解决: 凡是验证必须前加^后加$
    20                   ^表示开头位置的xxxx,$表示结尾位置的xxxx
    21                    ^和$联用表示从头到尾必须完整匹配
    22      
    23     密码强度要求:6-8位,只能是字母、数字的组合
    24         至少包含一位大写字母至少包含一位数字
    25           预判(?):1.不全由小写字母或数字组成,可能包含大写或符号
    26                (?! [a-z0-9]*$)
    27         2. 不全由大写或小写字母组成,可能包含数字或符号
    28         (?![a-zA-Z]*$)
    29     正式规则:只能是字母数字的组合—>屏蔽了符号
    30                [a-zA-Z0-9]{6}
    31     补齐第四种查找关键词的方式:(即查找内容,又查找位置:)
    32         var arr=reg.exec(str)
    33           在str中查找下一个符合reg规则的关键词的内容和位置.
    34           强调: 每次只找一个
    35           返回值: 
    36         如果找到:arr:[0: 关键词内容, index: 关键词位置]
    37         没找到: 返回null
    38           如何查找所有: 
    39         仅循环调用即可!直到返回null为止
    40              不用指定开始查找位置,就可自动找下一个
    41  
    42     总结:查找关键字:
    43         1.var i=str.search(reg)?判断有没有 
    44         缺点:不能指定开始位置
    45         2.var arr=str.match(reg)?获得所有关键字内容,个数 
    46           缺点:不能返回位置
    47         3.var i=str.indexOf(“kword”[,starti])?从指定位置开始,查找下一个关键字的位置 
    48         缺点:不支持正则
    49         4.var arr=reg.exec(str)?即获得内容,又获得位置
    50           缺点:复杂
    51  
    52      正则:贪婪模式与懒惰模式
    53         默认贪婪模式:默认总是匹配最长的符合条件的字符串
    54               原因:.*或.+等引起
    55             懒惰模式:仅匹配最短的符合条件的字符串
    56             贪婪-->懒惰:(.*?)
    57         从正则表达式中获得子内容:2步
    58         1.正则表达式:用()包括要获取子内容的部分
    59         2.程序中,本次查找后:RegExp.$n-->n:第几个圆括号
    60             取本次匹配结果中第N个()匹配的子内容,正则中n从1开始
     1  ***String中的模式匹配API:4个
     2     2个查找:str.search(reg);str.match(reg);
     3     1个替换:str.replace(reg);
     4     1个切割:
     5  1. ***String中的正则API:
     6     1.替换:str.replace(reg,"替换值")
     7     固定套路:利用replace格式化数据
     8     “替换值中,也可用$n,和RegExp.$n的用法完全相同
     9     2.切割:var arr=str.split(reg);
    10 
    11  2.*Math  专门执行数学计算的对象
    12     封装了数学计算中常用的常量
    13       1.取整:3种:上取整 下取整 四舍五入取整
    14     Math.ceil(n)   Math.floor(n)  Math.round(n)
    15     对比:    round   VS  toFixed
    16               Math对象      Number对象
    17           只能取整        按任意小数位数(参数0~20之间)
    18            返回数字        返回字符串
    19       2.乘方、开平方:
    20     乘方:Math.pow(n,m):计算n的m次方
    21     开平方:Math.sqrt(n):计算n的平方根
    22       3.获取最大值最小值:
    23     getMax(a,b)
    24     Math.max(a,b,c...)    Math.min(a,b,c...)
    25      ***固定套路:变相实现获取数组中最大值
    26     Math.max.apply(Math,arr);--》Math.max(arr[0],...)
    27       4.随机数:Math.random();0<=n<1
    28      任意min到max之间去一个随机整数
    29     parseInt(Math.random()*(max-min+1)+min)
    30 
    31   3.*Date:封装了一个时间点,提供对时间日期的操作API
    32     创建Date对象:
    33     1.var now=new Date();//创建一个新日期对象同时,保存了*客户端*当前时间点的毫秒数。--获得当前时间
    34     2.var time=new Date("xxxx/xx/xx [xx:xx:xx]"35     3.var time new Date(年,月-1,日[,时,分,秒])
    36     date.getTime():获得日期对象中的毫秒数
    37 
    38      Date API
    39     1.每个分量都有一对儿get set方法
    40       getDay()获得星期,没有setDay
    41     2.命名:年月日星期,不加s,时分秒毫秒,加s
    42     3.返回值:月中的日取值范围从1开始到31结束
    43        其余都是从0开始到减1结束
    44      星期:日 一 二     六
    45            0  1  2      6
    46      月份:1月 2月    11月 12月
    47            0   1      10   11
    48      Date计算:2中
    49     1.两日期对象可直接相减,结果毫秒差
    50     2.对任意分量做加减:先get出来-》计算-》再set回去*直接修改原日期对象*
    51       date.set(date.getXXX()+-n)
    52 
    53     补:创建日期对象第四种:复制日期对象
    54     var date1=new Date();
    55     var date2=new Date(date1.getTime());
    56           //new Date(毫秒数)
    57     date2.setXXX(date2.getXXX()+-n)

    1.*错误/异常处理

     1 what:导致程序无法继续执行的异常状态
     2          js中一旦发生错误,就会自动创建一个error类型对象
     3     6种:
     4         SyntaxError:语法错误
     5         ReferenceError:引用错误,找不到变量或对象
     6         TypeError:类型错误,错误的使用了对象中的方法时
     7         RangeErroe:范围错误,参数超范围
     8         EVA了Error:调用eval函数出错
     9         URLError:URL错误
    10     错误处理:在程序发生错误时,保证程序不退出或正常退出
    11     如何错误处理
    12     语法:tryCatch:
    13          try{
    14            可能出错的代码段
    15         }catch(err){//仅在发生错误时才执行
    16          //一旦发生错err中就会自动存入Error对象
    17           1.记录/显示错误的信息
    18           2.继续向调用者抛出异常
    19         }[finally{
    20           无论对错一定都会执行的代码段
    21             释放资源    
    22         }]
    23         建议:尽量优先使用if…else语句代替tryCatch块,已知的
    24     try catch:解决浏览器兼容问题

    2.***Function 对象

     1 js中一切都是对象
     2             连函数也是对象
     3             函数名其实是引用函数定义
     4 
     5 **************************************************************************
     6 
     7     1.*arguments对象:
     8       重载:程序中可定义多个相同函数名,不同参数列表的函数调用者不必区分每个函数的参数,执行时,程序根据传入的参数个数,自动判断选择哪个函数执行。
     9 
    10     js语法不支持重载!但可用arguments对象模拟重载效果
    11     arguments对象:函数对象内,自动创建的专门接收所有参数值的类数组对象。
    12     arguments[i]:获得传入的下标为i的参数值
    13     arguments.length:获得传入的参数个数
    14 
    15     即使定义了参数变量,arguments对象同样会收到所有参数值
    16 
    17     2.****函数对象本质:
    18       1.创建函数对象:3种:
    19           1.声明方式:function 函数名(参数){
    20                 函数体;
    21                 return 返回值}
    22         函数名和函数定义都被提前
    23         在调用前后位置定义都行
    24          2.函数直接量:var 函数名=function(参数){
    25                 函数体;
    26                 return 返回值}
    27         仅函数名变量声明会提前,函数定义留在本地
    28         必须定义在调用前!
    29         3.使用new创建函数类型对象:
    30         var 函数名=new function("a","b",...,"函数体");
    31       2.***内存中的函数对象***
    32          创建函数对象时:同时创建2个对象:
    33             函数对象:函数的定义
    34             作用域链对象:保存了函数对象可用的变量位置
    35                     默认第一项指向window对象
    36           调用函数时:又会创建一个新对象:
    37             活动对象:专门保存局部变量的对象
    38             在作用域链对象中追加指向活动对象的引用
    39           调用后:默认仅释放活动对象
    40             作用域链对象中活动对象的引用出栈
    41     3.***匿名函数:定义时,不能指定函数名的函数
    42        何时使用:2大用途:
    43         1.匿名函数自调时:定义完,立刻执行 执行完立刻释放
    44           何时使用:只有确定函数只执行一次时!
    45           如何自调:(function(参数){
    46                函数体
    47             })(参数值);
    48         2.匿名函数回调:先将函数作为对象传递给另一个函数,
    49             由另一个函数自主决定在需要时调用
    50           何时使用:只要将一个函数对象传递给其他方法调用时
    51           如何回调:直接将匿名函数的声明传入另一函数中
    52     4.****闭包:
    53        问题:局部变量的全局变量的缺陷
    54          全局变量:容易全局污染
    55          局部变量:无法共享不能长久保存
    56        
    57        既可以共享,长久保存,又不会全局污染---闭包
    58     解决:3步:闭包3特点:
    59     1.定义外层函数:封装被保存的局部变量
    60     2.定义内层函数,执行对外层函数局部变量的操作
    61     3.外层函数返回内层函数的对象
    62       并且外层函数被调用,结果被保存在全局变量中
    63     
    64     何时使用:既反复使用局部变量,又避免全部污染--->闭包(保护局部变量,占内存)
    65     判断闭包3特点:
    66      1.嵌套函数
    67      2.内层函数操作了外层函数的局部变量
    68      3.外层函数将内层函数返回到外部,被全局变量保存住
    69 
    70     判断闭包执行结果:
    71      1.外层函数被调用几次,就有几个受保护的局部变量的副本
    72      2.反复调用来自一个闭包的函数,受保护的局部变量就变化几次
     1 1.面向对象:
     2     在程序中都是用一个对象来描述现实中的一个具体的东西。
     3     对象:封装多个数据的存储空间
     4     自定义对象:封装现实中一个东西的属性和功能的存储空间。
     5     现实中东西的属性会成为对象中的属性变量
     6     现实中东西的功能,会成为对象中的方法(函数)
     7      1.创建自定义对象
     8     3种:
     9     1.var obj={'属性名1':值1,'属性名2':值2,'功能名':function(){...}}
    10     js中一切都是对象!所有对象的底层都是hash数组
    11 
    12     属性:2种:obj.属性名  obj["属性名"]
    13     访问对象中不存在的属性
    14     (访问数组中不存在的下标):不会出错,返回undefined强行给不存在的属性赋值,不报错!js会自动创建同名属性
    15 
    16     如何判断某个对象是否包含指定成员:3种
    17     1.obj.hasOwnProperty("成员名")
    18         如果找到,返回true,否则返回false!
    19 
    20     方法:如何在方法中,访问当前对象自己:
    21     ****this关键字:运行时,指代正在*调用*方法的对象
    22                    (.前的对象)
    23         this本质是window下唯一的指针,指向当前正在调用方法的对象
     1 2.****继承
     2       面向对象三大特点:封装 继承 多态
     3         封装:将描述同一个东西的属性和方法,定义在一个对象中
     4         继承:父对象中的属性和方法,子对象可以直接使用
     5         多态:同一个对象,在不同情况下,呈现不同的状态
     6         重载:同一方法名,传入参数不同,执行不同的操作
     7         重写:子对象觉得父对象的成员不好用,可自己定义一个,覆盖子对象
     8       创建对象:3中:
     9     1.var obj={"属性名":值,
    10             ……,
    11             "方法名":function(){…this.属性…}
    12            }
    13     2.var obj=new Object();//创建一个空对象
    14       obj.属性名=值;
    15       obj.方法名=function(){…this.属性名…}
    16 
    17     3.利用构造函数*反复*批量*创建相同结构的对象
    18       构造函数:描述一类对象结构的特殊函数
    19       2步:
    20       1.定义构造函数
    21         function 构造函数|类型名(属性参数1,……){
    22             this.属性名=属性参数1;
    23             ...
    24             this.方法名=function(){...this.属性名...}
    25         }
    26       2.利用构造函数创建对象
    27         var obj=new 构造函数|类型名(属性值1,...);
    28         new:1.创建一个空对象:new obj={  };
    29             2.用空对象,调用构造函数
    30             构造函数在空对象中添加属性和方法
    31             3.设置新对象的_proto_指向构造函数的prototype
    32             4.返回新对象的地址
    33     
    34     继承:js中一切继承都是用原型对象实现的!
    35     原型对象(prototype):每个函数对象都有一个原型对象
    36             构造函数的原型对象负责保存所有子对象共享的成员!
    37             ---避免重复定义方法对象,浪费内存。
    38         说明:其实所有内置类型的API都是定义在类型.prototype
    39 
    40 
    41     扩展对象:2种:
    42     1.扩展共有属性:通过构造函数.prototype添加的属性
    43     2.扩展自有属性:通过某一个具体子对象添加的属性
    44     判断自有属性或共有属性:
    45     1.自有属性:obj.hasOwnProperty("属性名")
    46     2.共有属性:"属性名"in obj&&!obj.hasOwnProperty("属性名")
    47          在原关系中包含   且   子对象没有
    48 
    49     删除属性:delete对象.属性名
    50         *仅能删除当前对象自己的属性,无法删除共有属性
    51     全局变量:3种:
    52     var n=1;  |  window.n=1  |  window["n"]=1
    53     不能delete    不能delete     可被delete
    54 
    55     原型链:由各级对象的_proto_逐级继承形成的关系
    56     获得任意对象的父级原型对象:
    57         Object.getPropertyOf(子对象)
    58         ==>子对象._proto_
    59 
    60 
    61     检查对象的父对象:父对象.isPrototypeOf(子对象)
     1 3.原形,原型链,继承:
     2     原型:保存所有子对象共有属性和方法的对象!
     3          所有函数都有prototype,指向自己的原型对象
     4          所有对象都有_proto_,指向自己父级原型对象
     5          所有原型对象都有constructor,指回原型对应的构造函数
     6 
     7     原型链:所有父子级对象间由_proto_形成的多级引用关系-->*多级*继承
     8 
     9     原型相关API:
    10     1.判断自有属性和共有属性:
    11         1.自有:obj.hasOwnProperty("属性名");
    12         2.判断原型链上的属性:2种:
    13            判断不包含:if(!("属性"in obj))
    14               if(obj.属性名==undefined)
    15               if(!obj.属性名)
    16         3.仅判断共有:必须满足两个条件
    17         !obj.hasOwnProperty("属性名")
    18         &&
    19         obj.属性名
    20            2.获得任意对象的原型:
    21         obj._proto_ X
    22         onject.getPropertyOf(obj)
    23     3.判断父对象是否在子对象的原型链上
    24          父对象.isPrototypeOf(子对象)
     1 ***检测一个对象是不是数组类型:4种
     2     1.Array.prototype.isPrototypeOf(obj);
     3     2.obj instanceof Array
     4          对象  是不是   构造函数  的实例
     5     3.obj.constructor==Array仅判断直接父级
     6     4.利用当前对象,强行调用原始的toString方法
     7     Object.prototype.toString.call(obj)=="[object Array]"
     8                  .apply(obj)
     9 
    10     继承:代码重用!
    11     1.直接继承对象:想法设法修改对象的_proto_
    12        3种:
    13        1.仅修改一个对象的_proto_
    14           Object.setPrototypeOf(子对象,父对象)
    15        2.通过修改构造函数的原型对象,实现批量修改后续子对象的继承关系。
    16         构造函数.prototype=父对象
    17            强调:仅影响之后创建的对象的继承关系
    18        3.var obj=Object.create(父对象[,{属性列表}])
    19           创建一个空对象
    20           继承父对象中的属性
    21           继承同时可再扩展属性和方法
    22     2.仅继承结构
    23        function 父类型构造函数(属性参数1,属性参数2){
    24         this.属性1=属性参数1;
    25         this.属性2=属性参数2;
    26        }
    27        function 子类型构造函数(属性参数1,属性参数2,属性参数3){
    28             父类型构造函数.call(this,属性参数1,属性参数2);
    29         this.属性3=属性参数3;
    30            }
    31        var obj=new 子类型构造函数(值1,值2,值3){
    32         
    33        }
  • 相关阅读:
    saltstack安装和配置
    puppet安装和配置
    mongodb使用
    mongdb安装
    redis数据类型
    redis安装
    memcached结合php以及memcache共享session
    yum安装的Apache的各种配置文件的位置
    memcached 基本操作
    memcached基本操作和语法
  • 原文地址:https://www.cnblogs.com/Dummer/p/11537944.html
Copyright © 2020-2023  润新知