WEB前端网页设计

您所在的位置：网站首页 › 网页设计方框选项代码 › WEB前端网页设计

WEB前端网页设计

2023-06-03 18:54| 来源: 网络整理| 查看: 265

JavaScript 类型转换

JavaScript 数据类型

typeof 操作符

constructor 属性

JavaScript 类型转换

将数字转换为字符串

将布尔值转换为字符串

将日期转换为字符串

将字符串转换为数字

一元运算符 +

将布尔值转换为数字

将日期转换为数字

自动转换类型

自动转换为字符串

JavaScript 正则表达式

什么是正则表达式？

语法

使用字符串方法

search() 方法使用正则表达式

search() 方法使用字符串

replace() 方法使用正则表达式

replace() 方法使用字符串

你注意到了吗？

正则表达式修饰符

正则表达式模式

使用 RegExp 对象

使用 test()

使用 exec()

JavaScript 类型转换

Number() 转换为数字， String() 转换为字符串， Boolean() 转换为布尔值。

JavaScript 数据类型

在 JavaScript 中有 6 种不同的数据类型：

stringnumberbooleanobjectfunctionsymbol

3 种对象类型：

ObjectDateArray

2 个不包含任何值的数据类型：

nullundefined typeof 操作符

你可以使用 typeof 操作符来查看 JavaScript 变量的数据类型。

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)的数据类型为 objectnull 的数据类型是 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() 方法描述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) 方法描述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 方法描述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):

原始值转换为数字转换为字符串转换为布尔值false0"false"falsetrue1"true"true00"0"false11"1"true"0"0"0"true"000"0"000"true"1"1"1"trueNaNNaN"NaN"falseInfinityInfinity"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"truefunction(){}NaN"function(){}"true{ }NaN"[object Object]"truenull0"null"falseundefinedNaN"undefined"false JavaScript 正则表达式

正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。

搜索模式可用于文本搜索和文本替换。

什么是正则表达式？

正则表达式是由一个字符序列形成的搜索模式。

当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。

正则表达式可以是一个简单的字符，或一个更复杂的模式。

正则表达式可用于所有文本搜索和文本替换的操作。

语法 /正则表达式主体/修饰符(可选)

其中修饰符是可选的。

是一个修饰符 (搜索不区分大小写)。

使用字符串方法

在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()。

search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。

replace() 方法用于在字符串中用一些字符串替换另一些字符串，或替换一个与正则表达式匹配的子串。

search() 方法使用正则表达式

使用正则表达式搜索 "Runoob" 字符串，且不区分大小写：

var str = "Visit CSDN!"; var n = str.search(/CSDN/i);

输出结果为：

search() 方法使用字符串

search 方法可使用字符串作为参数。字符串参数会转换为正则表达式：

检索字符串中 "CSDN" 的子串：

var str = "Visit CSDN!"; var n = str.search("CSDN"); replace() 方法使用正则表达式

使用正则表达式且不区分大小写将字符串中的 Microsoft 替换为 CSDN :

var str = document.getElementById("demo").innerHTML; var txt = str.replace(/microsoft/i,"CSDN");

结果输出为:

Visit CSDN!

replace() 方法使用字符串

replace() 方法将接收字符串作为参数：

var str = document.getElementById("demo").innerHTML; var txt = str.replace("Microsoft","CSDN"); 你注意到了吗？

正则表达式参数可用在以上方法中 (替代字符串参数)。正则表达式使得搜索功能更加强大(如实例中不区分大小写)。正则表达式修饰符

修饰符可以在全局搜索中不区分大小写:

修饰符描述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":

/e/.exec("The best things in life are free!");

字符串中含有 "e"，所以该实例输出为:

【本文地址】

WEB前端网页设计

WEB前端网页设计

今日新闻

推荐新闻