JavaScript基础视频教程总结（081-090章）
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>081-090章总结</title> </head> <body> <pre> 081. Date对象 在JS中使用Date对象来表示一个时间 </pre> <script type="text/javascript"> console.log("--第081--"); //如果直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间 var d01 = new Date(); console.log(d01) //创建一个指定的时间对象 //需要在构造函数中传递一个表示时间的字符串作为参数 //日期的格式 月份/日/年 时:分:秒 var d02 = new Date("2/18/2011 11:10:30") console.log(d02) // getDate() - 获取当前日期对象是几日 var curDate = d02.getDate() console.log(curDate) // getDay() - 获取当前日期对象时周几 - 会返回一个0-6的值 0 表示周日 1表示周一 var curDay = d01.getDay() console.log("今天是周"+curDay) //getMonth() 获取当前时间对象的月份 -会返回一个0-11的值 0 表示1月 11 表示12月 var curMonth = d01.getMonth() console.log("本月是"+(curMonth+1)+"月") // getFullYear() - 获取当前日期对象的年份 var curYear = d01.getFullYear() console.log("今年是"+curYear+"年") /* * getTime() * - 获取当前日期对象的时间戳 * - 时间戳，指的是从格林威治标准时间的1970年1月1日，0时0分0秒 * 到当前日期所花费的毫秒数（1秒 = 1000毫秒） * - 计算机底层在保存时间时使用都是时间戳 */ var getTime = d01.getTime() console.log(getTime) console.log( getTime/1000/60/60/24/365 ) //利用时间戳来测试代码的执行的性能 //获取当前的时间戳 var start = Date.now() for(var i=0 ; i<30 ; i++){ console.log(i) } var end = Date.now() console.log("代码执行了"+(end-start)+"毫秒"); </script> <pre> 082. Math - Math和其他的对象不同，它不是一个构造函数， 它属于一个工具类不用创建对象，它里边封装了数学运算相关的属性和方法 Math 对象属性 1. Math.PI 表示的圆周率 Math 对象方法 1. Math.abs(x) 返回数的绝对值 2. Math.ceil(x) 对数进行上舍入 3. Math.floor(x) 对数进行下舍入 4. Math.round(x) 可以对一个数进行四舍五入取整 5. Math.max(x,y) 返回 x 和 y 中的最高值 6. Math.min(x,y) 返回 x 和 y 中的最低值 7. Math.pow(x,y) 返回 x 的 y 次幂 8. Math.sqrt(x) 返回数的平方根 9. Math.random() 返回 0 ~ 1 之间的随机数(小数) </pre> <div id="randomColor">随机颜色</div> <script type="text/javascript"> console.log("--第082--"); var pi = Math.PI console.log(pi) var zNum1 = 5.1 var zNum2 = 5.9 var fNum1 = -5.1 var fNum2 = -5.9 var abs1 = Math.abs(zNum1) var abs2 = Math.abs(fNum1) console.log(abs1) console.log(abs2) console.log("-------") var ceil1 = Math.ceil(zNum1) var ceil2 = Math.ceil(zNum2) var ceil3 = Math.ceil(fNum1) var ceil4 = Math.ceil(fNum2) console.log(ceil1) // 6 console.log(ceil2) // 6 console.log(ceil3) // -5 console.log(ceil4) // -5 var floor1 = Math.floor(zNum1) var floor2 = Math.floor(zNum2) var floor3 = Math.floor(fNum1) var floor4 = Math.floor(fNum2) console.log(floor1) // 5 console.log(floor2) // 5 console.log(floor3) // -6 console.log(floor4) // -6 var round1 = Math.round(zNum1) var round2 = Math.round(zNum2) var round3 = Math.round(fNum1) var round4 = Math.round(fNum2) console.log(round1) // 5 console.log(round2) // 6 console.log(round3) // -5 console.log(round4) // -6 var max1 = Math.max(1,2,3,10,18) var max2 = Math.max(-1,-2.1,-2.9,-3,-10,-18) console.log(max1) // 18 console.log(max2) // -1 var min1 = Math.min(1,2,3,10,18) var min2 = Math.min(-1,-2.1,-2.9,-3,-10,-18) console.log(min1) // 1 console.log(min2) // -18 var pow = Math.pow(2,4) console.log(pow) // 16 var sqrt = Math.sqrt(2) console.log(sqrt) // 1.414 var random1 = Math.random() console.log(random1) // 产生随机整数，包含下限值，但不包括上限值 function randomNoUpp(lower,upper){ return Math.floor( Math.random()*(upper-lower) + lower ) } // 产生随机整数，包含下限值，包括上限值 function random(lower,upper){ return Math.floor( Math.random()*(upper-lower+1) + lower ) } var random2 = randomNoUpp(1,10) var random3 = random(1,10) console.log(random2) console.log(random3) // 扩展随机颜色值 function randomColor(){ var r =random(0,255),g =random(0,255),b =random(0,255) var result = "rgb("+r+","+g+","+b+"0" return result } var random_Color = document.getElementById("randomColor") random_Color.style.color = randomColor() </script> <pre> 083. 包装类 基本类型：Undefined, Null, Boolean, Number, String 引用类型：Object, Array, Date, RegExp （其实就是对象） JS中只有对象才有属性和方法，原始值没有属性和方法 那么我们平常求字符串的长度 用length属性不是没有问题吗？ 在JS中为我们提供了三个包装类，通过这三个包装类可以将基本数据类型的数据转换为对象 String() - 可以将基本数据类型字符串转换为String对象 Number() - 可以将基本数据类型的数字转换为Number对象 Boolean() - 可以将基本数据类型的布尔值转换为Boolean对象 但是注意：我们在实际应用中不会使用基本数据类型的对象，如果使用基本数据类型的对象，在做一些比较时可能会带来一些不可预期的结果 引用类型与基本包装类型的区别： 它们的对象生命周期不同： 引用类型：使用new创建引用类型的实例，在执行数据流离开当前作用域时会一直存储在内存中。 基本包装类型：自动创建基本包装类型的对象，只执行一行代码的瞬间之后就会立即销毁。 </pre> <script type="text/javascript"> console.log("--第083--"); var num = new Number(3); var num2 = new Number(3); var str = new String("hello"); var str2 = new String("hello"); var bool = new Boolean(true); var bool2 = true; console.log(typeof num) //object console.log(num == num2) //false 比较的是对象的地址 var b = new Boolean(false); if(b){ console.log("我运行了~~~"); // b为对象转换为Boolean，都为true } /* * 方法和属性之能添加给对象，不能添加给基本数据类型 * 当我们对一些基本数据类型的值去调用属性和方法时， * 浏览器会临时使用包装类将其转换为对象，然后在调用对象的属性和方法 * 调用完以后，在将其转换为基本数据类型 */ var s = 123 s = s.toString() console.log(s) // "123" console.log(typeof s) // string var s2 =456 s2.hello="hello" console.log(s2) // 456 console.log(s2.hello) //undefined var str="hello word"; // 1.创建出一个和基本类型值相同的对象 //var str = new String("hello world"); // 2.这个对象就可以调用包装对象下的方法，并且返回结给long变量 //var long = str.length; // 3.之后这个临时创建的对象就被销毁了 //str = null; //因为str没有length属性 所以执行这步之前后台会自动执行以上三步操作 var long = str.length; console.log(long); // 10 console.log(str.hello) //undefined </script> <pre> 084. 字符串的方法 在底层字符串是以字符数组的形式保存的,["a","b""c"] length属性-可以用来获取字符串的长度 charAt()-可以返回字符串中指定位置的字符,根据索引获取指定的字符,从0开始 charCodeAt()-获取指定位置字符的字符编码（Unicode编码） String.formCharCode()-可以根据字符编码去获取字符 concat()-可以用来连接两个或多个字符串 indexof() - 该方法可以检索一个字符串中是否含有指定内容 - 如果字符串中含有该内容，则会返回其第一次出现的索引 - 如果没有找到指定的内容，则返回-1 - 可以指定一个第二个参数，指定开始查找的位置 lastIndexOf() - 该方法的用法和indexOf()一样， - 不同的是indexOf是从前往后找， - 而lastIndexOf是从后往前找 - 也可以指定开始查找的位置 slice(x,y) - 可以从字符串中截取指定的内容 - 不会影响原字符串，而是将截取到内容返回 - 参数： 第一个，开始位置的索引（包括开始位置） 第二个，结束位置的索引（不包括结束位置） - 如果省略第二个参数，则会截取到后边所有的 - 也可以传递一个负数作为参数，负数的话将会从后边计算 substring(x,y)- 可以用来截取一个字符串，可以slice()类似 - 参数： - 第一个：开始截取位置的索引（包括开始位置） - 第二个：结束位置的索引（不包括结束位置） - 不同的是这个方法不能接受负值作为参数， 如果传递了一个负值，则默认使用0 - 而且他还自动调整参数的位置，如果第二个参数小于第一个，则自动交换 substr(x,y)-用来截取字符串 - 参数： 1.截取开始位置的索引 2.截取的长度 split()-可以将一个字符串拆分为一个数组 - 参数： - 需要一个字符串作为参数，将会根据该字符串去拆分数组 如果传递一个空串作为参数，则会将每个字符都拆分为数组中的一个元素 toUpperCase()-将一个字符串转换为大写并返回 toLowerCase()-将一个字符串转换为小写并返回 </pre> <script type="text/javascript"> console.log("--第084--"); var baseStr = "aBcdefG" var baseStr2 = "aabbcdcc" var strLength = baseStr.length console.log("strLength=" + strLength) //7 var charAt = baseStr.charAt(3) console.log("charAt=" + charAt) // d var charCodeAt = baseStr.charCodeAt(0) console.log("charCodeAt=" + charCodeAt) //97 var formCharCode = String.fromCharCode(97) console.log("formCharCode=" + formCharCode) //a var concat = baseStr.concat("hijklmn","opqist") console.log("concat=" + concat) //aBcdefGhijklmnopqist var indexOf1 = baseStr2.indexOf("c") var indexOf2 = baseStr2.indexOf("e") console.log("indexOf1=" + indexOf1) // 4 console.log("indexOf2=" + indexOf2) // -1 var lastIndexOf1 = baseStr2.lastIndexOf("c",5) var lastIndexOf2 = baseStr2.lastIndexOf("e") console.log("lastIndexOf1=" + lastIndexOf1) // 4 console.log("lastIndexOf2=" + lastIndexOf2) // -1 var slice = baseStr.slice(1,3) var slice2 = baseStr.slice(1,-1) console.log("slice=" + slice) // Bc console.log("slice2=" + slice2) // Bcdef var substring = baseStr.substring(1,3) var substring2 = baseStr.substring(3,-3) console.log("substring=" + substring) // Bc console.log("substring2=" + substring2) // aBc var substr = baseStr.substr(1,3) var substr2 = baseStr.substr(3,0) console.log("substr=" + substr) // Bcd console.log("substr2=" + substr2) // 空 console.log(typeof substr2) // string var split =baseStr.split("d") console.log("split=" + split) // aBc,efG console.log(typeof split) // object console.log(Array.isArray(split)) //true var toUpperCase =baseStr.toUpperCase() console.log("toUpperCase=" + toUpperCase) // ABCEFG var toLowerCase =baseStr.toLowerCase() console.log("toLowerCase=" + toLowerCase) // abcefg </script> <pre> 085. 正则表达式的简介 正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE） 使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。 搜索模式可用于文本搜索和文本替换。 正则表达式是由一个字符序列形成的搜索模式。 当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。 正则表达式可以是一个简单的字符，或一个更复杂的模式。 正则表达式可用于所有文本搜索和文本替换的操作。 </pre> <script type="text/javascript"> console.log("--第085--"); //创建正则表达式的对象 /* * 语法： * var 变量 = new RegExp("正则表达式","匹配模式"); * 使用typeof检查正则对象，会返回object * var reg = new RegExp("a"); 这个正则表达式可以来检查一个字符串中是否含有a * 在构造函数中可以传递一个匹配模式作为第二个参数， * 可以是 * i 忽略大小写 * g 执行一个全局的匹配,简而言之,就是找到所有的匹配,而不是在找到第一个之后就停止了 * m 多行查找 */ var reg = new RegExp("a","g"); var str = "A"; /* * 正则表达式的方法： * test() * - 使用这个方法可以用来检查一个字符串是否符合正则表达式的规则， 如果符合则返回true，否则返回false */ var result = reg.test(str); console.log(result); //false console.log(reg.test("AcAAAA")); //false console.log(reg.test("AcAAAa")); //true </script> <pre> 086. 正则语法 使用字面量来创建正则表达式 语法：var 变量 = /正则表达式/匹配模式 注意：//里面表达式前后不能有空格 使用字面量的方式创建更加简单 使用构造函数创建更加灵活 </pre> <script type="text/javascript"> console.log("--第086--"); // var reg = new RegExp("a","g"); var reg = /a/g console.log(typeof reg) // object console.log(reg.test("abc")) //true // 使用 | 表示或者的意思 reg = /a|b|c/; console.log(reg.test("ab")) //true console.log(reg.test("A")) //false console.log(reg.test("de")) //false // 创建一个正则表达式检查一个字符串中是否有字母 /* * []里的内容也是或的关系 * [ab] == a|b * [a-z] 任意小写字母 * [A-Z] 任意大写字母 * [A-z] 任意字母 * [0-9] 任意数字 */ var reg = /[A-z]/ console.log(reg.test("de")) //true // 检查一个字符串中是否含有 abc 或 adc 或 aec var reg = /a[bde]c/ // [^...] 表达式用于查找任何不在方括号之间的字符，有一个不在即为true。 reg = /[^ab]/; console.log(reg.test("de")) //true console.log(reg.test("ab")) //false reg = /[^0-9]/; console.log(reg.test("ab")) //true console.log(reg.test("123aaa")) //true //有一个不在即为true console.log(reg.test("123")) //false console.log(reg.test("abs")) //true </script> <pre> 087. 字符串和正则相关的方法 split() - 可以将一个字符串拆分为一个数组 - 方法中可以传递一个正则表达式作为参数，这样方法将会根据正则表达式去拆分字符串 - 这个方法即使不指定全局匹配，也会全都插分 - 如果分割符在串的头和尾在在头和尾加上空值 search() - 可以搜索字符串中是否含有指定内容 - 如果搜索到指定内容，则会返回第一次出现的索引，如果没有搜索到返回-1 - 它可以接受一个正则表达式作为参数，然后会根据正则表达式去检索字符串 - serach()只会查找第一个，即使设置全局匹配也没用 match() - 可以根据正则表达式，从一个字符串中将符合条件的内容提取出来 - 默认情况下我们的match只会找到第一个符合要求的内容，找到以后就停止检索 我们可以设置正则表达式为全局匹配模式，这样就会匹配到所有的内容 可以为一个正则表达式设置多个匹配模式，且顺序无所谓 - match()会将匹配到的内容封装到一个数组中返回，即使只查询到一个结果 replace(x,y) - 可以将字符串中指定内容替换为新的内容 - 参数： 1.被替换的内容，可以接受一个正则表达式作为参数 2.新的内容 - 默认只会替换第一个 </pre> <script type="text/javascript"> console.log("第087"); var regStr = "a1a2b3c4d5f" var splitResult = regStr.split(/[A-z]/) console.log(splitResult) // ["", "1", "2", "3", "4", "5", ""] var searchResult = regStr.search(/[A-z]/) console.log(searchResult) // 0 var matchResult = regStr.match(/[A-z]/g) console.log(matchResult) // ["a", "a", "b", "c", "d", "f"] var replaceResult = regStr.replace(/[A-z]/g , '*') console.log(replaceResult) // *1*2*3*4*5* console.log(regStr) // a1a2b3c4d5f </script> <pre> 088. 正则表达式语法 量词 - 通过量词可以设置一个内容出现的次数 - 量词只对它前边的一个内容起作用 贪婪量词 n+ 从后往前一个个匹配，只匹配一次，设全局也没用 惰性量词 n+? 从前往后一个个匹配,设全局有用 ,支配量词(js不支持)n++ 匹配整个字符串 </pre> <script type="text/javascript"> console.log("第088"); // {n, m} 匹配前一项至少n次,但是不能超过m次 // {n, } 匹配前一项n次,或者多次 // {n} 匹配前一项恰好n次 // ? 匹配前一项0次或1次,也就是说前一项是可选的. 等价于 {0, 1} // + 匹配前一项1次或多次,等价于{1,} // * 匹配前一项0次或多次.等价于{0,} //检查一个字符串中是否含有aaa var regExp = /a{3}/ // ababab var regExp = /(ab){3}/ // abc ,abbc ,abbbc reg = /ab{1,3}c/; console.log( reg.test("abc") ) //true console.log( reg.test("abbc") ) //true console.log( reg.test("abbbc") ) //true console.log( reg.test("abbbbc") ) //false //检查一个字符串中是否以a开头 // ^ 表示开头 // $ 表示结尾 //如果在正则表达式中同时使用^ $则要求字符串必须完全符合正则表达式 reg = /^a$/ console.log(reg.test("a")) // true console.log(reg.test("aa")) // false // 创建一个正则表达式，用来检查一个字符串是否是一个合法手机号 var regMobile = /^1[3-9][0-9]{9}$/ console.log(regMobile.test("11000000000")) //false console.log(regMobile.test("11000000000sss")) //false console.log(regMobile.test("15111111111")) //true </script> <pre> 089. 正则表达式语法2 检查一个字符串中是否含有 . . 表示任意字符 在正则表达式中使用\作为转义字符 \. 来表示. \\ 表示\ 注意：使用构造函数时，由于它的参数是一个字符串，而\是字符串中转义字符， 如果要使用\则需要使用\\来代替 </pre> <script type="text/javascript"> console.log("第089"); var reg = /\./; reg = /\\/; reg = new RegExp("\\."); reg = new RegExp("\\\\"); // [...] 位于括号之内的任意字符 // [^...] 不在括号之中的任意字符 // . 除了换行符之外的任意字符,等价于[^\n] // \w 任何单字字符, 等价于[A-z0-9_] // \W 任何非单字字符,等价于[^A-z0-9_] // \s 任何空白符,等价于[\ t \ n \ r \ f \ v] // \S 任何非空白符,等价于[^\ t \ n \ r \ f \ v] // \d 任何数字,等价于[0-9] // \D 除了数字之外的任何字符,等价于[^0-9] // \b 单词边界 // \B 除了单词边界 reg = /\w/; reg = /\W/; reg = /\d/; reg = /\D/; reg = /\s/; reg = /\S/; // 创建一个正则表达式检查一个字符串中是否含有单词child var regChild = /\bchild\b/ console.log(regChild.test("hellochild")) // false console.log(regChild.test("hello childddd")) // false console.log(regChild.test("hello child")) // true // 去除空格 var str = " sss he llo fff "; str = str.replace( /^\s*|\s*$/g ,'') //去头尾 str = str.replace( /\s{2,}/g ,' ') // 去中间 console.log(str) </script> <pre> 090. 邮件的正则 </pre> <script type="text/javascript"> console.log("第090"); // 01asQQ.ss_fdsa@01asQQ.com.cn // 任意字母数字下划线 .任意字母数字下划线 @ 任意字母数字 .任意字母（2-5位） .任意字母（2-5位） var regMail = /^\w{3,}(\.|\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/ console.log(regMail.test("as_.wfsfeas@sfsd5.com.cn")) //true </script> </body> </html>
所有基础课程链接：
1.JavaScript基础视频教程总结（001-010章） 2.JavaScript基础视频教程总结（011-020章） 3. JavaScript基础视频教程总结（021-030章） 4. JavaScript基础视频教程总结（031-040章）
5. JavaScript基础视频教程总结（041-050章） 6. JavaScript基础视频教程总结（051-060章） 7. JavaScript基础视频教程总结（061-070章） 8. JavaScript基础视频教程总结（071-080章）
9. JavaScript基础视频教程总结（081-090章） 10. JavaScript基础视频教程总结（091-100章） 11. JavaScript基础视频教程总结（101-110章） 12. JavaScript基础视频教程总结（111-120章）
13. JavaScript基础视频教程总结（121-130章） 14. JavaScript基础视频教程总结（131-140章）
另外，欢迎关注我的新浪微博
