JavaScript基础(一) 数据类型
动态类型
JavaScript 是一种弱类型或者说动态语言。这意味着你不用提前声明变量的类型,在程序运行过程中,类型会被自动确定。
数据类型
最新的 ECMAScript
标准定义了 7 种数据类型:
6 种 原始类型:
Boolean
Null
Undefined
Number
String
Symbol (ECMAScript 6 新定义)
和 Object
typeof 检测数据类型
typeof
用来检测给定变量的数据类型,返回下列某个字符串:
"boolean” --- 变量是布尔值(true/false)
"undefined" --- 变量未定义
"string" --- 变量是字符串
"number" --- 变量是数值
"function" --- 变量是函数
"object" --- 变量是对象或null
"symbol" --- 变量是Symbol
有这样一道题目,考察 typeof
返回值类型。
typeof(typeof(new Date())) //string
但是在实际项目中,typeof
也只是用来判断变量是undefined
和 function
。因为很多类型不能精确的判断出来,例如:
Value | function | typeof |
---|---|---|
"foo" | String | string |
new String("foo") | String | object |
1.2 | Number | number |
new Number(1.2) | Number | object |
true | Boolean | boolean |
new Boolean(true) | Boolean | object |
new Date() | Date | object |
new Error() | Error | object |
[1,2,3] | Array | object |
new Array(1, 2, 3) | Array | object |
new Function("") | Function | function |
/abc/g | RegExp | object |
new RegExp("meow") | RegExp | object |
{} | Object | object |
new Object() | Object | object |
注意
typeof /s/ ===function; // Chrome 1-12 , 不符合 ECMAScript 5.1
typeof /s/ === object; // Firefox 5+ , 符合 ECMAScript 5.1
由上得出结论,当使用检测结果是object
或function
时,我们并不能看出实际的数据类型。
推荐使用 Object.prototype.toString()
,结合call
去实现对变量类型的精准判断。
Object.prototype.toString.call(null); //”[object Null]”
Object.prototype.toString.call(undefined); //”[object Undefined]”
Object.prototype.toString.call(“abc”); //”[object String]”
Object.prototype.toString.call(123); //”[object Number]”
Object.prototype.toString.call(true); //”[object Boolean]”
简单封装如下:
function _typeof(obj){if(typeof obj == object || typeof obj == function){var type =Object.prototype.toString.call(obj).split("")[1].toLowerCase();return type.match(/[a-z]/g).join(""); //正则去除字符串的]}return typeof obj; }
上面代码在标准浏览器中可以完全兼容,但是IE6
(虽然现在不必兼容,也要了解下)中,却会出现以下问题:
_typeof(null); //object
_typeof(undefined); //object
原因在于IE6下
Object.prototype.toString.call(undefined); //”[object Object]”
Object.prototype.toString.call(null); //”[object Object]”
所以要先添加判断,使用String()
对象将 undefined
,null
转为字符串。代码如下:
function _typeof (obj){//注意到这里是 == 而不是 === ,//undefined 值是派生自 null 值的,所以null == undefined 返回true if(obj == null){return String(obj)}if(typeof obj == "object"; || typeof obj == "function"){var type =Object.prototype.toString.call(obj).split(" ")[1].toLowerCase();return type.substring(0,type.length-1); }return typeof obj; }
String()
函数遵循下列转换规则:
如果值有toString()
方法,则调用该方法(没有参数)并返回相应的结果;
如果值是null
,则返回"null"
;
如果值是undefined
,则返回"undefined"
。
这样对 typeof
的扩展就封装好了。代码还有优化空间,这里不再继续。
Jquery
已经实现了类型检测的封装,jquery.type()
的内部实现如下:
//实例对象是能直接使用原型链上的方法的
var class2type = {};
var toString = class2type.toString;jQuery.each("Boolean Number String Function Array Date RegExp Object Error".split(" "), function(i, name) {class2type[ "[object " + name + "]" ] = name.toLowerCase();
});$.type = function( obj ) {//如果是null或者undefined,直接转成String返回//注意到这里是==而不是===,//undefined 值是派生自 null 值的,所以null == undefined 返回true if ( obj == null ) {return String( obj );}//当typeof 返回 object或function, 进入core_toString return typeof obj === "object" || typeof obj === "function" ?class2type[ core_toString.call(obj) ] || "object":typeof obj;
}
Undefined
Undefined
类型只有一个值,即特殊的 undefined
。在使用 var
声明变量但未对其加以初始化时,这个变量的值就是 undefined
,例如:
var foo;
alert(foo == undefined); //true
undefined
表示"缺少值",就是此处应该有一个值,但是还没有定义。
典型用法是:
变量被声明了,但没有赋值时,就等于
undefined
。调用函数时,应该提供的参数没有提供,该参数等于
undefined
。对象没有赋值的属性,该属性的值为
undefined
。函数没有返回值时,默认返回
undefined
。
var name;
alert(name) // undefinedfunction f(x){console.log(x)}
f() // undefinedvar o = new Object();
alert(o.p) // undefinedvar x = f();
alert(x) // undefined
Null
Null
类型是第二个只有一个值的数据类型,这个特殊的值是 null
。
如果定义的变量准备在将来用于保存对象,那么最好将该变量初始化为 null
。
null
有时会被当作一种对象类型,但是这其实只是语言本身的一个bug,即对 null
执行 typeof null
时会返回字符串"object"
。
原理是这样的,不同的对象在底层都表示为二进制,在
JavaScript
中二进制前三位都为0
的话会被判断为object
类型,null
的二进制表示是全0
,自然前三位也是0
,所以执行typeof
时会返回“object”
。——《你不知道的JavaScript》
使用null
的情况:
1.DOM
,试图获取一个不存在的元素返回一个null
值,而不是undefined
。
2.初始化一个对象的值,一般设为null
。
3.通过分配null
值,有效地清除引用,并假设对象没有引用其他代码,指定垃圾收集,确保回收内存。
var table = document.getElementById("table");
console.log(table); // nullvar obj = null; //初始化对象window.onload = function(){var el = document.getElementById("id");var id = el.id; //解除循环引用el.onclick = function(){alert(id); }el = null; // 将闭包引用的外部函数中活动对象清除
}
Boolean
Boolean
类型是常用的一种类型,只有两个字面值:true
和 false
。
注意:字面值区分大小写,True 和 False 不是 Boolean 值。
经常遇到就是其他数据类型转为boolean的问题,只要遵循一个原则:
当值为
""
(空字符串)、0
、NaN
、null
、undefined
时,都转为false
,其他情况都为true
。
JavaScript基础(一) 数据类型相关推荐
- JavaScript基础-基本数据类型和基本流程控制
2019独角兽企业重金招聘Python工程师标准>>> JavaScript基础1 一.基本数据类型 1.Number 2.String 3.Null 4.Undefined 5.t ...
- JavaScript基础学习--数据类型
JavaScript 数据类型 在 JavaScript 中有 5 中不同的数据类型: string number boolean object function 3 种对象类型: Object Da ...
- JavaScript基础复习之数据类型,解读数据类型不为人知的一面
<=> 朋友你好,这里是小毅的前端日记, 分享代码日常 ! <=> 本文目标:查缺补漏Javascript数据类型,解读数据类型不为人知的一面 <=> 卑微的大三前 ...
- JavaScript基础,Cookies,Sessions
php和JavaScript,掌握JavaScript基础,自定义函数,流程控制语句,事件,调用JavaScript脚本,在PHP中使用JavaScript. JavaScript是网景公司开发的,是 ...
- 前端---JavaScript基础1
文章目录 前端---JavaScript基础1 数据类型 面向对象 对象创建方式 对象类型判断 前端-JavaScript基础1 JS是 解释型语言:跨平台 慢 编译型语言:不能跨平台 快 数据类型 ...
- JavaScript基础07-day09【嵌套for循环、break和continue、对象、数据类型、对象字面量、函数】
学习地址: 谷粒学院--尚硅谷 哔哩哔哩网站--尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通) JavaScript基础.高级学习笔记汇总表[尚硅谷最新版Ja ...
- JavaScript基础01【简介、js编写位置、基本语法(6种基本数据类型)】
学习地址: 谷粒学院---尚硅谷 尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通) JavaScript基础.高级学习笔记汇总表[尚硅谷最新版JavaScrip ...
- javascript基础系列:javascript中的变量和数据类型(一)
javascript基础系列:javascript中的变量和数据类型(一) 今天开始去重新系统温习一遍js基础,并作下记录 javascript是由三部分组成: ECMASCRIPT(ES): 描述了 ...
- javascript百炼成仙 第一章 掌握JavaScript基础1.4数据类型
修行还在继续,随着对要诀的深入,叶小凡明白,在编程世界,刚才的直接量都属于一种数据.和人有男女一样,数据也是有类型的. 在JavaScript中,数据可分为两类,分别为原生数据类型(primitive ...
最新文章
- Codeup-问题 C: 货币系统
- pythonwhile循环实战教程_Python入门丨for循环和while循环
- ext的另一个table布局的例子
- 俞敏洪回应新东方向国家图书馆捐课
- 全连接层和卷积层最终应用在网络上的不同之处
- Python的安装与配置
- 线性代数 行列式 知识技巧思维导图 [21考研上岸之旅]
- 基于ATMEGA128的密码锁
- c语言程序商品的打折,C语言程序设计习题doc.doc
- 25 | 业务安全体系:对比基础安全,业务安全有哪些不同?
- excel表格公式使用失败,输出只有公式,没显示结果
- 【知识点2】最大公约数与最小公约数
- 容联七陌助力VIPKID,优质客户服务赢得家长青睐
- 安装并使用Ghidra的Eclipse插件的过程
- 计算机只存在于计算机硬盘上,计算机病毒只存在于计算机硬盘上。()
- dell服务器r730老自动重启_Re: DELL R730 服务器异常卡死导致iDRAC控制台无信号以及服务器远程连接失败重启后报内存错误(已插拔并已改变卡槽位置)...
- 个人项目-地铁出行线路规划程序
- JVM 上篇(12):垃圾回收相关概念
- windows下更改文件创建修改访问时间
- Java实现适配器模式