JavaScript编程基础2
Posted 0点0度
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript编程基础2相关的知识，希望对你有一定的参考价值。
1，数据类型相关操作
使用typeof x函数查看变量的数据类型：
typeof "John" // 返回 string typeof 3.14 // 返回 number typeof false // 返回 boolean typeof [1,2,3,4] // 返回 object，数组是一种特殊的对象类型 typeof {name:‘John‘, age:34} // 返回 object， 因此 typeof [1,2,3,4] 返回 object
null：
null表示什么都没有，它自己是一种类型，表示一个空对象引用。所以可以把变量设置为null来清空对象。
undefined：
在 javascript 中, undefined 是一个没有设置值的变量。typeof 一个没有值的变量会返回 undefined。
null和undefined区别：
typeof undefined // undefined typeof null // object null === undefined // false null == undefined // true
2，类型转换
在 JavaScript 中有 5 种不同的数据类型：
- string
- number
- boolean
- object
- function
3 种对象类型：
- Object
- Date
- Array
2 个不包含任何值的数据类型：
- null
- undefined
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] }
在我看来，js中的数组：var mycar=new Array("hello","i am","fine")是对象的实例，而[1,2,4]这种，更接近真正意义上的数组。
isArray()和isDate()用法，第一个为例
//看isArray()的用法， var fruits = ["Banana", "Orange", "Apple", "Mango"]; document.getElementById("demo").innerhtml = isArray(fruits); //返回true //true直接会写到id=demo的元素中
数据类型转换：变成字符串
String(x) 把数字转换为字符串
String(x) // 将变量 x 转换为字符串并返回 String(123) // 将数字 123 转换为字符串并返回 String(100 + 23) // 将数字表达式转换为字符串并返回，先算，后转换，转换以后是，字符串123，当然了输出的时候并不会表明自己的类型
toString()也是这样的作用：(123).toString()
其他的数字变字符串方法简介：留后再学，赶进度
| 方法 | 描述 |
|---|---|
| toExponential() | 把对象的值转换为指数计数法。 |
| toFixed() | 把数字转换为字符串，结果的小数点后有指定位数的数字。 |
| toPrecision() | 把数字格式化为指定的长度。 |
布尔值转换为字符串：
String(false) // 返回 字符串false false.toString() // 返回 字符串false，两个方法都可以
日期变成字符串：
String(new Date()) //返回当前日期的字符串格式 obj.toString() //同上
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("99 88") // 返回 NaN
var x="5";
var y=+5; //y将是数字5，一元运算符可以把变量转化为数字，如果不能转化，那就得到NaN，仍旧是数字类型
其他字符串转换为数字的方法：
| 方法 | 描述 |
|---|---|
| parseFloat() | 解析一个字符串，并返回一个浮点数。 |
| parseInt() | 解析一个字符串，并返回一个整数 |
布尔值转化为数字：
Number(false) // 返回 0 Number(true) // 返回 1
日期转化为数字：
d = new Date(); Number(d) //我得到的是15多少多少的一个数，估计是时间戳
//用d.getTime()也是可以的。
数据类型转换：自动转换类型
当 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" 为什么数字123会转换成字符串123呢，我估计可能是因为html需要输出统一的字符给用户看 myVar = true // toString 转换为 "true" myVar = false // toString 转换为 "false"
3，正则表达式
语法实例：
var patt = /runoob/i //声明变量patt等于rundoob，i表示不区分大小写；这语法和sed，awk有点像
正则的修饰符：
| 修饰符 | 描述 |
|---|---|
| i | 执行对大小写不敏感的匹配。 |
| g | 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。 |
| m | 执行多行匹配。 |
search() 方法
用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
var str = "Visit Runoob!"; var n = str.search(/Runoob/i); //返回6
replace() 方法
用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
<body> <button onclick="myFunction()">点我</button> //按钮激发事件 <p id="demo">请访问 Microsoft!</p> <script> function myFunction() { var str = document.getElementById("demo").innerHTML; //得到id=demo的元素的内容，赋值给str var txt = str.replace(/microsoft/i,"Runoob"); //声明变量txt等于在str的基础上把microsoft换成runoob。 document.getElementById("demo").innerHTML = txt; //重写id=demo的元素 } </script> </body>
js中的正则表达式简介：
| 表达式 | 描述 |
|---|---|
| [abc] | 查找方括号之间的任何字符。 |
| [0-9] | 查找任何从 0 至 9 的数字。 |
| (x|y) | 查找任何以 | 分隔的选项。 |
| 元字符 | 描述 |
|---|---|
| d | 查找数字。 |
| s | 查找空白字符。 |
| 匹配单词边界。 | |
| uxxxx | 查找以十六进制数 xxxx 规定的 Unicode 字符。 |
| 量词 | 描述 |
|---|---|
| n+ | 匹配任何包含至少一个 n 的字符串。 |
| n* | 匹配任何包含零个或多个 n 的字符串。 |
| n? | 匹配任何包含零个或一个 n 的字符串。 |
使用 RegExp 对象
在 JavaScript 中，RegExp 对象是一个预定义了属性和方法的正则表达式对象
调用var xxx=new RegExp(‘patton‘)就可以使用以下命令：
使用test（）：
test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。
<script> var patt1=new RegExp("e"); //实例化 document.write(patt1.test("The best things in life are free")); // 返回true，注意格式，是patt.test()，作用是查找字符串中有没有e。
</script>
//简写：/e/.test("The best things in life are free!") 厉害了，还有这种操作，但是好像不支持正则修饰符
使用exec（）：
exec() 方法用于检索字符串中的正则表达式的匹配。该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
<script> var patt1=new RegExp("be|es"); document.write(patt1.exec("The best things in life are free")); </script> //返回的是be，所以我觉得它实际上只是返回匹配到的第一个值
4，javascript错误
try 语句测试代码块的错误。它允许我们定义在执行时进行错误测试的代码块。
catch 语句处理错误。catch 语句允许我们定义当 try 代码块发生错误时，所执行的代码块。
throw 语句创建自定义错误。当错误发生时，JavaScript 引擎通常会停止，并生成一个错误消息。
try...catch...
<script> var txt=""; function message(){ try { adddlert("Welcome guest!"); //特意写错了alert，如果try语句有错误，那就执行catch语句 } catch(err) { //catch 块会捕捉到 try 块中的错误，并执行代码来处理它。 txt="本页有一个错误。 "; txt+="错误描述：" + err.message + " "; //捕捉错误用err.message txt+="点击确定继续。 "; alert(txt); } } </script> </head> <body> <input type="button" value="查看消息" onclick="message()" /> //激发事件 </body>
throw语句
<body> <p>请输出一个 5 到 10 之间的数字:</p> <input id="demo" type="text"> //定义了一个文本框，用于收集用户端的信息 <button type="button" onclick="myFunction()">测试输入</button> //按钮激发事件 <p id="message"></p> //结果会更新在这个段落中，尽管现在是空的 <script> function myFunction() { var message, x; //两个变量 message = document.getElementById("message"); //message相当于获取元素了 message.innerHTML = ""; //元素的用空填充的 x = document.getElementById("demo").value; //x用于获取用户的输入 try { if(x == "") throw "值为空"; //如果用户的输入是空的话，直接引发错误，下面的代码不执行了，调到catch语句，打印出错误.err指代的是什么呢？其实就是throw后面的部分。 if(isNaN(x)) throw "不是数字"; x = Number(x); if(x < 5) throw "太小"; if(x > 10) throw "太大"; } catch(err) { message.innerHTML = "错误: " + err; //向带id=message的元素中输出错误 } } </script> </body> </html>
以上是关于JavaScript编程基础2的主要内容，如果未能解决你的问题，请参考以下文章