[JS基础] 之类型判断

前言

首先需要特别说明的是，JavaScript 是面向对象的编程语言 (OOP)。

既然是面向对象的编程语言，自然就可以不同类型的对象。

那在JavaScript 中， 有哪些对象类型呢？

这些类型的对象之间如何区别呢？

常见对象类型

1. 字符串(String)对象

String 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE constructor 对创建该对象的函数的引用 1 4 length 字符串的长度 1 3 prototype 允许您向对象添加属性和方法 1 4

String 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE anchor() 创建 HTML 锚。 1 3 big() 用大号字体显示字符串。 1 3 blink() 显示闪动字符串。 1   bold() 使用粗体显示字符串。 1 3 charAt() 返回在指定位置的字符。 1 3 charCodeAt() 返回在指定的位置的字符的 Unicode 编码。 1 4 concat() 连接字符串。 1 4 fixed() 以打字机文本显示字符串。 1 3 fontcolor() 使用指定的颜色来显示字符串。 1 3 fontsize() 使用指定的尺寸来显示字符串。 1 3 fromCharCode() 从字符编码创建一个字符串。 1 4 indexOf() 检索字符串。 1 3 italics() 使用斜体显示字符串。 1 3 lastIndexOf() 从后向前搜索字符串。 1 3 link() 将字符串显示为链接。 1 3 localeCompare() 用本地特定的顺序来比较两个字符串。 1 4 match() 找到一个或多个正在表达式的匹配。 1 4 replace() 替换与正则表达式匹配的子串。 1 4 search() 检索与正则表达式相匹配的值。 1 4 slice() 提取字符串的片断，并在新的字符串中返回被提取的部分。 1 4 small() 使用小字号来显示字符串。 1 3 split() 把字符串分割为字符串数组。 1 4 strike() 使用删除线来显示字符串。 1 3 sub() 把字符串显示为下标。 1 3 substr() 从起始索引号提取字符串中指定数目的字符。 1 4 substring() 提取字符串中两个指定的索引号之间的字符。 1 3 sup() 把字符串显示为上标。 1 3 toLocaleLowerCase() 把字符串转换为小写。 - - toLocaleUpperCase() 把字符串转换为大写。 - - toLowerCase() 把字符串转换为小写。 1 3 toUpperCase() 把字符串转换为大写。 1 3 toSource() 代表对象的源代码。 1 - toString() 返回字符串。 - - valueOf() 返回某个字符串对象的原始值。 1 4

2. Date（日期）对象

Date 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE constructor 返回对创建此对象的 Date 函数的引用。 1 4 prototype 使您有能力向对象添加属性和方法。 1 4

Date 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE Date() 返回当日的日期和时间。 1 3 getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 1 3 getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。 1 3 getMonth() 从 Date 对象返回月份 (0 ~ 11)。 1 3 getFullYear() 从 Date 对象以四位数字返回年份。 1 4 getYear() 请使用 getFullYear() 方法代替。 1 3 getHours() 返回 Date 对象的小时 (0 ~ 23)。 1 3 getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。 1 3 getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。 1 3 getMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。 1 4 getTime() 返回 1970 年 1 月 1 日至今的毫秒数。 1 3 getTimezoneOffset() 返回本地时间与格林威治标准时间 (GMT) 的分钟差。 1 3 getUTCDate() 根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。 1 4 getUTCDay() 根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。 1 4 getUTCMonth() 根据世界时从 Date 对象返回月份 (0 ~ 11)。 1 4 getUTCFullYear() 根据世界时从 Date 对象返回四位数的年份。 1 4 getUTCHours() 根据世界时返回 Date 对象的小时 (0 ~ 23)。 1 4 getUTCMinutes() 根据世界时返回 Date 对象的分钟 (0 ~ 59)。 1 4 getUTCSeconds() 根据世界时返回 Date 对象的秒钟 (0 ~ 59)。 1 4 getUTCMilliseconds() 根据世界时返回 Date 对象的毫秒(0 ~ 999)。 1 4 parse() 返回1970年1月1日午夜到指定日期（字符串）的毫秒数。 1 3 setDate() 设置 Date 对象中月的某一天 (1 ~ 31)。 1 3 setMonth() 设置 Date 对象中月份 (0 ~ 11)。 1 3 setFullYear() 设置 Date 对象中的年份（四位数字）。 1 4 setYear() 请使用 setFullYear() 方法代替。 1 3 setHours() 设置 Date 对象中的小时 (0 ~ 23)。 1 3 setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)。 1 3 setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)。 1 3 setMilliseconds() 设置 Date 对象中的毫秒 (0 ~ 999)。 1 4 setTime() 以毫秒设置 Date 对象。 1 3 setUTCDate() 根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。 1 4 setUTCMonth() 根据世界时设置 Date 对象中的月份 (0 ~ 11)。 1 4 setUTCFullYear() 根据世界时设置 Date 对象中的年份（四位数字）。 1 4 setUTCHours() 根据世界时设置 Date 对象中的小时 (0 ~ 23)。 1 4 setUTCMinutes() 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。 1 4 setUTCSeconds() 根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。 1 4 setUTCMilliseconds() 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。 1 4 toSource() 返回该对象的源代码。 1 - toString() 把 Date 对象转换为字符串。 1 4 toTimeString() 把 Date 对象的时间部分转换为字符串。 1 4 toDateString() 把 Date 对象的日期部分转换为字符串。 1 4 toGMTString() 请使用 toUTCString() 方法代替。 1 3 toUTCString() 根据世界时，把 Date 对象转换为字符串。 1 4 toLocaleString() 根据本地时间格式，把 Date 对象转换为字符串。 1 3 toLocaleTimeString() 根据本地时间格式，把 Date 对象的时间部分转换为字符串。 1 3 toLocaleDateString() 根据本地时间格式，把 Date 对象的日期部分转换为字符串。 1 3 UTC() 根据世界时返回 1997 年 1 月 1 日 到指定日期的毫秒数。 1 3 valueOf() 返回 Date 对象的原始值。 1 4

3. Array（数组）对象

Array 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE constructor 返回对创建此对象的数组函数的引用。 1 4 index   1 4 input   1 4 length 设置或返回数组中元素的数目。 1 4 prototype 使您有能力向对象添加属性和方法。 1 4

Array 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE concat() 连接两个或更多的数组，并返回结果。 1 4 join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 1 4 pop() 删除并返回数组的最后一个元素 1 5.5 push() 向数组的末尾添加一个或更多元素，并返回新的长度。 1 5.5 reverse() 颠倒数组中元素的顺序。 1 4 shift() 删除并返回数组的第一个元素 1 5.5 slice() 从某个已有的数组返回选定的元素 1 4 sort() 对数组的元素进行排序 1 4 splice() 删除元素，并向数组添加新元素。 1 5.5 toSource() 返回该对象的源代码。 1 - toString() 把数组转换为字符串，并返回结果。 1 4 toLocaleString() 把数组转换为本地数组，并返回结果。 1 4 unshift() 向数组的开头添加一个或更多元素，并返回新的长度。 1 6 valueOf() 返回数组对象的原始值 1 4

4. Boolean（逻辑）对象

Boolean 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE constructor 返回对创建此对象的 Boolean 函数的引用 1 4 prototype 使您有能力向对象添加属性和方法。 1 4

Boolean 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE toSource() 返回该对象的源代码。 1 - toString() 把逻辑值转换为字符串，并返回结果。 1 4 valueOf() 返回 Boolean 对象的原始值。 1 4

5. Math（算数）对象

Math 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE E 返回算术常量 e，即自然对数的底数（约等于2.718）。 1 3 LN2 返回 2 的自然对数（约等于0.693）。 1 3 LN10 返回 10 的自然对数（约等于2.302）。 1 3 LOG2E 返回以 2 为底的 e 的对数（约等于 1.414）。 1 3 LOG10E 返回以 10 为底的 e 的对数（约等于0.434）。 1 3 PI 返回圆周率（约等于3.14159）。 1 3 SQRT1_2 返回返回 2 的平方根的倒数（约等于 0.707）。 1 3 SQRT2 返回 2 的平方根（约等于 1.414）。 1 3

Math 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE abs(x) 返回数的绝对值。 1 3 acos(x) 返回数的反余弦值。 1 3 asin(x) 返回数的反正弦值。 1 3 atan(x) 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。 1 3 atan2(y,x) 返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。 1 3 ceil(x) 对数进行上舍入。 1 3 cos(x) 返回数的余弦。 1 3 exp(x) 返回 e 的指数。 1 3 floor(x) 对数进行下舍入。 1 3 log(x) 返回数的自然对数（底为e）。 1 3 max(x,y) 返回 x 和 y 中的最高值。 1 3 min(x,y) 返回 x 和 y 中的最低值。 1 3 pow(x,y) 返回 x 的 y 次幂。 1 3 random() 返回 0 ~ 1 之间的随机数。 1 3 round(x) 把数四舍五入为最接近的整数。 1 3 sin(x) 返回数的正弦。 1 3 sqrt(x) 返回数的平方根。 1 3 tan(x) 返回角的正切。 1 3 toSource() 返回该对象的源代码。 1 - valueOf() 返回 Math 对象的原始值。 1 4

6. RegExp(正则表达式) 对象

RegExp 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE global RegExp 对象是否具有标志 g。 1 4 ignoreCase RegExp 对象是否具有标志 i。 1 4 lastIndex 一个整数，标示开始下一次匹配的字符位置。 1 4 multiline RegExp 对象是否具有标志 m。 1 4 source 正则表达式的源文本。 1 4

RegExp 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE compile 编译正则表达式。 1 4 exec 检索字符串中指定的值。返回找到的值，并确定其位置。 1 4 test 检索字符串中指定的值。返回 true 或 false。 1 4

7. HTML DOM 对象

对象 描述 Document 代表整个 HTML 文档，用来访问页面中的所有元素。 Anchor 代表 <a> 元素。 Area 代表图像地图中的 <area> 元素。 Base 代表 <base> 元素。 Body 代表图像地图中的 <body> 元素。 Button 代表 <button> 元素。 Event 代表事件的状态 Form 代表 <form> 元素 Frame 代表 <frame> 元素 Frameset 代表 <frameset> 元素 Iframe 代表 <iframe> 元素 Image 代表 <img> 元素 Input button 代表 HTML 表单中的按钮 Input checkbox 代表 HTML 表单中的选择框 Input file 代表 HTML 表单中的 fileupload 。 Input hidden 代表 HTML 表单中的隐藏域。 Input password 代表 HTML 表单中的密码域。 Input radio 代表 HTML 表单中的单选框。 Input reset 代表 HTML 表单中的重置按钮。 Input submit 代表 HTML 表单中的确认按钮。 Input text 代表 HTML 表单中的文本输入域。 Link 代表 <link> 元素 Meta 代表 <meta> 元素 Object代表一个 <Object> 元素 Option 代表 <option> 元素 Select 代表 HTML 表单中的选择列表。 Style 代表某个单独的样式声明。 Table 代表 <table> 元素。 TableData 代表 <td> 元素。 TableRow 代表 <tr> 元素。 Textarea 代表 <textarea> 元素。

8. 其他对象

对象 描述 Window JavaScript 层级中的顶层对象。Window 对象表示浏览器窗口。每当 <body> 或者 <frameset> 标签出现，Window 对象就会被自动创建。 Navigator 包含客户端浏览器的信息。 Screen 包含客户端显示屏的信息。 History 包含了浏览器窗口访问过的 URL。 Location 包含了当前URL的信息。

类型判断

我们都知道， 在js 中 定义一个变量使用 var i = 的方式。

也就是说，定义的时候并没有指定类型， 只是在之后的使用中赋予值。

在赋予值之后， 如何判断这个变量的类型呢。

1.  使用 typeof方法。

看简单的例子， 判断String 和 Object 的类型

<!--Add by oscar999--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Author" CONTENT="oscar999"><script>var obj = {key1:'value1'};alert(typeof(obj));var str = "11";alert(typeof(str))</script></HEAD><BODY></BODY></HTML>

2.  使用 instanceof  的方式

使用typeof 可以区别出String 和 Object 的类型。

但是如果对一个数组进行typeof 的话， 发现值也是 object , 也就是说， 无法判断出0bject 和 Array 的区别.

var arry = ["11","22"];alert(typeof(arry));

这样的话就可以使用 instanceof 的方式了。

<!--Add by oscar999--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Author" CONTENT="oscar999"><script>var obj = {key1:'value1'};alert(obj instanceof Object);var arry = ["11","22"];alert(arry instanceof Array);</script></HEAD><BODY></BODY></HTML>

需要注意的部分

1.  注意typeof 和 instanceof 使用时首字母大小写的区别。

“object”是类型的字符串， Object 是对象。

string/String 也是 类似。

2. instanceof 是对象型使用的方法。

对于字符串来说有 基本类型的String 和 对象型的String, 这个Java 的概念有点类似。

比较以下的区别：

<!--Add by oscar999--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Author" CONTENT="oscar999"><script>var str1 = "11";var str2 = new String("11");alert(typeof(str1)); // stringalert(typeof(str2)); // objectalert(str1 instanceof String); //falsealert(str2 instanceof String); //true</script></HEAD><BODY></BODY></HTML>