JavaScript学习重点二（题点）

九、JavaScript 类型转换

JavaScript 数据类型 在 JavaScript 中有 5 种不同的数据类型： string number boolean object function 3 种对象类型： Object Date Array 2 个不包含任何值的数据类型：   null undefined

typeof "John"                 // 返回 string  typeof 3.14                   // 返回 number typeof NaN                    // 返回 number typeof false                  // 返回 boolean typeof [1,2,3,4]              // 返回 object typeof {name:'John', age:34}  // 返回 object typeof new Date()             // 返回 object typeof function () {}         // 返回 function typeof myCar                  // 返回 undefined (如果 myCar 没有声明) typeof null                   // 返回 object   NaN 的数据类型是 number 数组(Array)的数据类型是 object 日期(Date)的数据类型为 object null 的数据类型是 object 未定义变量的数据类型为 undefined 如果对象是 JavaScript Array 或 JavaScript Date ，我们就无法通过 typeof 来判断他们的类型，因为都是 返回 object。

constructor 属性 constructor 属性返回所有 JavaScript 变量的构造函数。 实例 "John".constructor                 // 返回函数 String()  { [native code] } (3.14).constructor                 // 返回函数 Number()  { [native code] } false.constructor                  // 返回函数 Boolean() { [native code] } [1,2,3,4].constructor              // 返回函数 Array()   { [native code] } {name:'John', age:34}.constructor  // 返回函数 Object()  { [native code] } new Date().constructor             // 返回函数 Date()    { [native code] } function () {}.constructor         // 返回函数 Function(){ [native code] }   你可以使用 constructor 属性来查看对象是否为数组 (包含字符串 "Array"): 实例 function isArray(myArray) {     return myArray.constructor.toString().indexOf("Array") > -1; }   你可以使用 constructor 属性来查看对象是否为日期 (包含字符串 "Date"): 实例 function isDate(myDate) {     return myDate.constructor.toString().indexOf("Date") > -1; }

JavaScript 类型转换 JavaScript 变量可以转换为新变量或其他数据类型： 通过使用 JavaScript 函数 通过 JavaScript 自身自动转换 将数字转换为字符串 全局方法 String() 可以将数字转换为字符串。 该方法可用于任何类型的数字，字母，变量，表达式： 实例 String(x)         // 将变量 x 转换为字符串并返回 String(123)       // 将数字 123 转换为字符串并返回 String(100 + 23)  // 将数字表达式转换为字符串并返回 尝试一下 » Number 方法 toString() 也是有同样的效果。 实例 x.toString() (123).toString() (100 + 23).toString() 尝试一下 » 在 Number 方法 章节中，你可以找到更多数字转换为字符串的方法： 方法 描述 toExponential() 把对象的值转换为指数计数法。 toFixed() 把数字转换为字符串，结果的小数点后有指定位数的数字。 toPrecision() 把数字格式化为指定的长度。   将布尔值转换为字符串 全局方法 String() 可以将布尔值转换为字符串。 String(false)        // 返回 "false" String(true)         // 返回 "true" Boolean 方法 toString() 也有相同的效果。 false.toString()     // 返回 "false" true.toString()      // 返回 "true"   将日期转换为字符串 Date() 返回字符串。 Date()      // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time) 全局方法 String() 可以将日期对象转换为字符串。 String(new Date())      // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time) Date 方法 toString() 也有相同的效果。 实例 obj = new Date() obj.toString()   // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time) 在 Date 方法 章节中，你可以查看更多关于日期转换为字符串的函数： 方法 描述 getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。 getFullYear() 从 Date 对象以四位数字返回年份。 getHours() 返回 Date 对象的小时 (0 ~ 23)。 getMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。 getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。 getMonth() 从 Date 对象返回月份 (0 ~ 11)。 getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。 getTime() 返回 1970 年 1 月 1 日至今的毫秒数。   将字符串转换为数字 全局方法 Number() 可以将字符串转换为数字。 字符串包含数字(如 "3.14") 转换为数字 (如 3.14). 空字符串转换为 0。 其他的字符串会转换为 NaN (不是个数字)。 Number("3.14")    // 返回 3.14 Number(" ")       // 返回 0  Number("")        // 返回 0 Number("99 88")   // 返回 NaN 在 Number 方法 章节中，你可以查看到更多关于字符串转为数字的方法： 方法 描述 parseFloat() 解析一个字符串，并返回一个浮点数。 parseInt() 解析一个字符串，并返回一个整数。   一元运算符 + Operator + 可用于将变量转换为数字： 实例 var y = "5";      // y 是一个字符串 var x = + y;      // x 是一个数字 尝试一下 » 如果变量不能转换，它仍然会是一个数字，但值为 NaN (不是一个数字): 实例 var y = "John";   // y 是一个字符串 var x = + y;      // x 是一个数字 (NaN) 尝试一下 »   将布尔值转换为数字 全局方法 Number() 可将布尔值转换为数字。 Number(false)     // 返回 0 Number(true)      // 返回 1   将日期转换为数字 全局方法 Number() 可将日期转换为数字。 d = new Date(); Number(d)          // 返回 1404568027739 日期方法 getTime() 也有相同的效果。 d = new Date(); d.getTime()        // 返回 1404568027739   自动转换类型 当 JavaScript 尝试操作一个 "错误" 的数据类型时，会自动转换为 "正确" 的数据类型。 以下输出结果不是你所期望的： 5 + null    // 返回 5         null 转换为 0 "5" + null  // 返回"5null"   null 转换为 "null" "5" + 1     // 返回 "51"      1 转换为 "1"   "5" - 1     // 返回 4         "5" 转换为 5   自动转换为字符串 当你尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法： document.getElementById("demo").innerHTML = myVar; myVar = {name:"Fjohn"}  // toString 转换为 "[object Object]" myVar = [1,2,3,4]       // toString 转换为 "1,2,3,4" myVar = new Date()      // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200" 数字和布尔值也经常相互转换： myVar = 123             // toString 转换为 "123" myVar = true            // toString 转换为 "true" myVar = false           // toString 转换为 "false" 下表展示了使用不同的数值转换为数字(Number), 字符串(String), 布尔值(Boolean): 原始值 转换为数字 转换为字符串 转换为布尔值 实例 false 0 "false" false 尝试一下 » true 1 "true" true 尝试一下 » 0 0 "0" false 尝试一下 » 1 1 "1" true 尝试一下 » "0" 0 "0" true 尝试一下 » "000" 0 "000" true 尝试一下 » "1" 1 "1" true 尝试一下 » NaN NaN "NaN" false 尝试一下 » Infinity Infinity "Infinity" true 尝试一下 » -Infinity -Infinity "-Infinity" true 尝试一下 » "" 0 "" false 尝试一下 » "20" 20 "20" true 尝试一下 » "Runoob" NaN "Runoob" true 尝试一下 » [ ] 0 "" true 尝试一下 » [20] 20 "20" true 尝试一下 » [10,20] NaN "10,20" true 尝试一下 » ["Runoob"] NaN "Runoob" true 尝试一下 » ["Runoob","Google"] NaN "Runoob,Google" true 尝试一下 » function(){} NaN "function(){}" true 尝试一下 » { } NaN "[object Object]" true 尝试一下 » null 0 "null" false 尝试一下 » undefined NaN "undefined" false

十、JavaScript 正则表达式

JavaScript 正则表达式 正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。 搜索模式可用于文本搜索和文本替换。 什么是正则表达式？ 正则表达式是由一个字符序列形成的搜索模式。 当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。 正则表达式可以是一个简单的字符，或一个更复杂的模式。 正则表达式可用于所有文本搜索和文本替换的操作。 语法 /正则表达式主体/修饰符(可选) 其中修饰符是可选的。   实例： var patt = /runoob/i 实例解析： /runoob/i  是一个正则表达式。 runoob  是一个正则表达式主体 (用于检索)。 i  是一个修饰符 (搜索不区分大小写)。 使用字符串方法 在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()。 search() 方法 用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。 replace() 方法 用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。 search() 方法使用正则表达式 实例 使用正则表达式搜索 "Runoob" 字符串，且不区分大小写： var str = "Visit Runoob!"; var n = str.search(/Runoob/i); 输出结果为： 6 尝试一下 »   search() 方法使用字符串 search 方法可使用字符串作为参数。字符串参数会转换为正则表达式： 实例 检索字符串中 "Runoob" 的子串： var str = "Visit Runoob!"; var n = str.search("Runoob"); 尝试一下 »   replace() 方法使用正则表达式 实例 使用正则表达式且不区分大小写将字符串中的 Microsoft 替换为 Runoob : var str = document.getElementById("demo").innerHTML; var txt = str.replace(/microsoft/i,"Runoob"); 结果输出为: Visit Runoob! 尝试一下 »   replace() 方法使用字符串 replace() 方法将接收字符串作为参数： var str = document.getElementById("demo").innerHTML; var txt = str.replace("Microsoft","Runoob"); 尝试一下 »   你注意到了吗？   正则表达式参数可用在以上方法中 (替代字符串参数)。 正则表达式使得搜索功能更加强大(如实例中不区分大小写)。   正则表达式修饰符 修饰符 可以在全局搜索中不区分大小写: 修饰符 描述 i 执行对大小写不敏感的匹配。 g 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。 m 执行多行匹配。   正则表达式模式 方括号用于查找某个范围内的字符： 表达式 描述 [abc] 查找方括号之间的任何字符。 [0-9] 查找任何从 0 至 9 的数字。 (x|y) 查找任何以 | 分隔的选项。 元字符是拥有特殊含义的字符： 元字符 描述 \d 查找数字。 \s 查找空白字符。 \b 匹配单词边界。 \uxxxx 查找以十六进制数 xxxx 规定的 Unicode 字符。 量词: 量词 描述 n+ 匹配任何包含至少一个 n 的字符串。 n* 匹配任何包含零个或多个 n 的字符串。 n? 匹配任何包含零个或一个 n 的字符串。   使用 RegExp 对象 在 JavaScript 中，RegExp 对象是一个预定义了属性和方法的正则表达式对象。 使用 test() test() 方法是一个正则表达式方法。 test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。 以下实例用于搜索字符串中的字符 "e"： 实例 var patt = /e/; patt.test("The best things in life are free!"); 字符串中含有 "e"，所以该实例输出为： true 尝试一下 » 你可以不用设置正则表达式的变量，以上两行代码可以合并为一行： /e/.test("The best things in life are free!")   使用 exec() exec() 方法是一个正则表达式方法。 exec() 方法用于检索字符串中的正则表达式的匹配。 该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。 以下实例用于搜索字符串中的字母 "e": Example 1 /e/.exec("The best things in life are free!"); 字符串中含有 "e"，所以该实例输出为: e 尝试一下 » 更多实例 JS 判断输入字符串是否为数字、字母、下划线组成 JS 判断输入字符串是否全部为字母 JS 判断输入字符串是否全部为数字

十一、JavaScript 调试

JavaScript 调试工具 在程序代码中寻找错误叫做代码调试。 调试很难，但幸运的是，很多浏览器都内置了调试工具。 内置的调试工具可以开始或关闭，严重的错误信息会发送给用户。 有了调试工具，我们就可以设置断点 (代码停止执行的位置), 且可以在代码执行时检测变量。 浏览器启用调试工具一般是按下 F12 键，并在调试菜单中选择 "Console" 。 console.log() 方法 如果浏览器支持调试，你可以使用 console.log() 方法在调试窗口上打印 JavaScript 值： 设置断点 在调试窗口中，你可以设置 JavaScript 代码的断点。 在每个断点上，都会停止执行 JavaScript 代码，以便于我们检查 JavaScript 变量的值。 在检查完毕后，可以重新执行代码（如播放按钮）。 debugger 关键字 debugger 关键字用于停止执行 JavaScript，并调用调试函数。 这个关键字与在调试工具中设置断点的效果是一样的。 如果没有调试可用，debugger 语句将无法工作。

十二、JavaScript使用

JavaScript 变量提升 JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。 JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。   "hoisting(变量提升)"。 变量提升：函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。 JavaScript 初始化不会提升 JavaScript 只有声明的变量会提升，初始化的不会。   JavaScript 严格模式(use strict) JavaScript 严格模式（strict mode）即在严格的条件下运行。 使用 "use strict" 指令 "use strict" 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增。 它不是一条语句，但是是一个字面量表达式，在 JavaScript 旧版本中会被忽略。 "use strict" 的目的是指定代码在严格条件下执行。 严格模式下你不能使用未声明的变量。 支持严格模式的浏览器: Internet Explorer 10 +、 Firefox 4+ Chrome 13+、 Safari 5.1+、 Opera 12+。 严格模式声明 严格模式通过在脚本或函数的头部添加 "use strict"; 表达式来声明。   在函数内部声明是局部作用域 (只在函数内使用严格模式):   为什么使用严格模式: 消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为; 消除代码运行的一些不安全之处，保证代码运行的安全； 提高编译器效率，增加运行速度； 为未来新版本的Javascript做好铺垫。 "严格模式"体现了Javascript更合理、更安全、更严谨的发展方向，包括IE 10在内的主流浏览器，都已经支持它，许多大项目已经开始全面拥抱它。 另一方面，同样的代码，在"严格模式"中，可能会有不一样的运行结果；一些在"正常模式"下可以运行的语句，在"严格模式"下将不能运行。掌握这些内容，有助于更细致深入地理解Javascript，让你变成一个更好的程序员。   === 为恒等计算符，同时检查表达式的值与类型，                          switch 语句会使用恒等计算符(===)进行比较:     浮点型数据使用注意事项 JavaScript 中的所有数据都是以 64 位浮点型数据(float) 来存储。 所有的编程语言，包括 JavaScript，对浮点型数据的精确度都很难确定： var x = 0.1; var y = 0.2; var z = x + y            // z 的结果为 0.3 if (z == 0.3)            // 返回 false   为解决以上问题，可以用整数的乘除法来解决： 实例 var z = (x * 10 + y * 10) / 10;       // z 的结果为 0.3     JavaScript 字符串分行 JavaScript 允许我们在字符串中使用断行语句: 实例 1 var x = "Hello World!";   但是，在字符串中直接使用回车换行是会报错的： 实例 2 var x = "Hello World!";   字符串断行需要使用反斜杠(\)，如下所示: 实例 3 var x = "Hello \ World!";   Return 语句使用注意事项 JavaScript 默认是在代码的最后一行自动结束。 以下两个实例返回结果是一样的(一个有分号一个没有): 实例 1 function myFunction(a) {     var power = 10       return a * power }   实例 2 function myFunction(a) {     var power = 10;     return a * power; }   在 JavaScript 中，分号是可选的 。 由于 return 是一个完整的语句，所以 JavaScript 将关闭 return 语句。 注意：不用对 return 语句进行断行。   数组中使用名字来索引 许多程序语言都允许使用名字来作为数组的索引。 使用名字来作为索引的数组称为关联数组(或哈希)。 JavaScript 不支持使用名字来索引数组，只允许使用数字索引。 实例 var person = []; person[0] = "John"; person[1] = "Doe"; person[2] = 46; var x = person.length;         // person.length 返回 3 var y = person[0];             // person[0] 返回 "John"   在 JavaScript 中, 对象 使用 名字作为索引。 如果你使用名字作为索引，当访问数组时，JavaScript 会把数组重新定义为标准对象。 执行这样操作后，数组的方法及属性将不能再使用，否则会产生错误: 实例 var person = []; person["firstName"] = "John"; person["lastName"] = "Doe"; person["age"] = 46; var x = person.length;         // person.length 返回 0 var y = person[0];             // person[0] 返回 undefined   Undefined 不是 Null 在 JavaScript 中, null 用于对象, undefined 用于变量，属性和方法。 对象只有被定义才有可能为 null，否则为 undefined。 如果我们想测试对象是否存在，在对象还没定义时将会抛出一个错误。 错误的使用方式： if (myObj !== null && typeof myObj !== "undefined") 正确的方式是我们需要先使用 typeof 来检测对象是否已定义： if (typeof myObj !== "undefined" && myObj !== null) 程序块作用域 在每个代码块中 JavaScript 不会创建一个新的作用域，一般各个代码块的作用域都是全局的。 以下代码的的变量 i 返回 10，而不是 undefined： 实例 for (var i = 0; i < 10; i++) {     // some code } return i;