JavaScript 的数据类型及其检测

JavaScript 有几种类型的值?

Javascript 有两种数据类型,分别是基本数据类型和引用数据类型。其中基本数据类型包括 Undefined、Null、Boolean、Number、String、Symbol (ES6 新增,表示独一无二的值),而引用数据类型统称为 Object 对象,主要包括对象、数组和函数。接下来我们分别看下两者的特点。

基本数据类型

1.值是不可变的

var name = ‘java‘;
name.toUpperCase(); // 输出 ‘JAVA‘
console.log(name); // 输出  ‘java‘

由此可得,基本数据类型的值是不可改变的

2.存放在栈区

原始数据类型直接存储在栈(stack)中的简单数据段,占据空间小、大小固定,属于被频繁使用数据,所以放入栈中存储。

3.值的比较

var a = 1;
var b = true;
console.log(a == b);    // true
console.log(a === b);   // false

== : 只进行值的比较,会进行数据类型的转换。

=== : 不仅进行值得比较,还要进行数据类型的比较。

引用数据类型

1.值是可变的

var a={age:20};
a.age=21;
console.log(a.age)//21

上面代码说明引用类型可以拥有属性和方法,并且是可以动态改变的。

2.同时保存在栈内存和堆内存

引用数据类型存储在堆(heap)中的对象,占据空间大、大小不固定,如果存储在栈中,将会影响程序运行的性能;引用数据类型在栈中存储了指针,该指针指向堆中该实体的起始地址。当解释器寻找引用值时,会首先检索其在栈中的地址,取得地址后从堆中获得实体。

3.比较是引用的比较

当从一个变量向另一个变量赋引用类型的值时,同样也会将存储在变量中的对象的值复制一份放到为新变量分配的空间中。

var a={age:20};
var b=a;
b.age=21;
console.log(a.age==b.age)//true

上面我们讲到基本类型和引用类型存储于内存的位置不同,引用类型存储在堆中的对象,与此同时,在栈中存储了指针,而这个指针指向正是堆中实体的起始位置。变量 a 初始化时,a 指针指向对象{age:20}的地址,a 赋值给 b 后,b 又指向该对象{age:20}的地址,这两个变量指向了同一个对象。因此,改变其中任何一个变量,都会相互影响。

此时,如果取消某一个变量对于原对象的引用,不会影响到另一个变量。

var a={age:20};
var b=a;
a = 1;
b // {age:20}

上面代码中,a 和 b 指向同一个对象,然后 a 的值变为 1,这时不会对 b 产生影响,b 还是指向原来的那个对象。

检验数据类型

1.typeof

typeof 返回一个表示数据类型的字符串,返回结果包括:number、boolean、string、symbol、object、undefined、function 等 7 种数据类型,但不能判断 null、array 等

typeof Symbol(); // symbol 有效
typeof ‘‘; // string 有效
typeof 1; // number 有效
typeof true; //boolean 有效
typeof undefined; //undefined 有效
typeof new Function(); // function 有效
typeof null; //object 无效
typeof [] ; //object 无效
typeof new Date(); //object 无效
typeof new RegExp(); //object 无效

数组和对象返回的都是 object,这时就需要使用 instanceof 来判断

2.instanceof

instanceof 是用来判断 A 是否为 B 的实例,表达式为:A instanceof B,如果 A 是 B 的实例,则返回 true,否则返回 false。instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

[] instanceof Array; //true
{} instanceof Object;//true
new Date() instanceof Date;//true
new RegExp() instanceof RegExp//true

关于数组的类型判断,还可以用 ES6 新增Array.isArray()

Array.isArray([]);   // true

instanceof 三大弊端:

对于基本数据类型来说,字面量方式创建出来的结果和实例方式创建的是有一定的区别的

console.log(1 instanceof Number)//false
console.log(new Number(1) instanceof Number)//true

从严格意义上来讲,只有实例创建出来的结果才是标准的对象数据类型值,也是标准的 Number 这个类的一个实例;对于字面量方式创建出来的结果是基本的数据类型值,不是严谨的实例,但是由于 JS 的松散特点,导致了可以使用 Number.prototype 上提供的方法。

只要在当前实例的原型链上,我们用其检测出来的结果都是 true。在类的原型继承中,我们最后检测出来的结果未必准确。

var arr = [1, 2, 3];
console.log(arr instanceof Array) // true
console.log(arr instanceof Object);  // true
function fn(){}
console.log(fn instanceof Function)// true
console.log(fn instanceof Object)// true

不能检测 null 和 undefined

对于特殊的数据类型 null 和 undefined,他们的所属类是 Null 和 Undefined,但是浏览器把这两个类保护起来了,不允许我们在外面访问使用。

3.严格运算符===

只能用于判断 null 和 undefined,因为这两种类型的值都是唯一的。

var a = null
typeof a // "object"
a === null // true

undefined 还可以用 typeof 来判断

var b = undefined;
typeof b === "undefined" // true
b === undefined // true

4.constructor

constructor 作用和 instanceof 非常相似。但 constructor 检测 Object 与 instanceof 不一样,还可以处理基本数据类型的检测。

var aa=[1,2];
console.log(aa.constructor===Array);//true
console.log(aa.constructor===RegExp);//false
console.log((1).constructor===Number);//true
var reg=/^$/;
console.log(reg.constructor===RegExp);//true
console.log(reg.constructor===Object);//false

constructor 两大弊端:

null 和 undefined 是无效的对象,因此是不会有 constructor 存在的,这两种类型的数据需要通过其他方式来判断。

函数的 constructor 是不稳定的,这个主要体现在把类的原型进行重写,在重写的过程中很有可能出现把之前的 constructor 给覆盖了,这样检测出来的结果就是不准确的

function Fn(){}
Fn.prototype = new Array()
var f = new Fn
console.log(f.constructor)//Array

5.Object.prototype.toString.call()

Object.prototype.toString.call() 最准确最常用的方式。首先获取 Object 原型上的 toString 方法,让方法执行,让 toString 方法中的 this 指向第一个参数的值。

关于 toString 重要补充说明:

  • 本意是转换为字符串,但是某些 toString 方法不仅仅是转换为字符串
  • 对于 Number、String,Boolean,Array,RegExp、Date、Function 原型上的 toString 方法都是把当前的数据类型转换为字符串的类型(它们的作用仅仅是用来转换为字符串的)
  • Object 上的 toString 并不是用来转换为字符串的。

Object 上的 toString 它的作用是返回当前方法执行的主体(方法中的 this)所属类的详细信息即"[object Object]",其中第一个 object 代表当前实例是对象数据类型的(这个是固定死的),第二个 Object 代表的是 this 所属的类是 Object

Object.prototype.toString.call(‘‘) ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window是全局对象global的引用

 

原文地址:https://www.cnblogs.com/xiaoqi2018/p/10290005.html

时间: 2024-08-29 17:03:37

JavaScript 的数据类型及其检测的相关文章

JavaScript 基本数据类型 与类型检测

一.[JavaScript 基本数据类型] JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型 "string"   "number"   "object"   "boolean"   "function"   "undefined" <1> string类型 属性: str.length var str = "123,ABC,900,rgy,r

JS-安全检测JavaScript基本数据类型和内置对象的方法

前言:在前端开发中经常会需要用到检测变量数据类型的需求,比如:判断一个变量是否为undefined或者null来进行下一步的操作,今天在阅读“编写高质量代码-改善JavaScript程序的188个建议”这本书的时候看到这个比较好的方法,在此小记一笔以备在以后的开发中使用. 1:如下所示是我编写的演示代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>I

javascript toString数据类型检测

一.typeof 是一个一元运算符.检测数据类型,返回一个字符串,包含数据类型信息.例如:“number,string,undefined” 局限性: 1.typeof null ===> “object” 2.typeof []  ===>  "object" 不能具体检测对象数据类型的细分项(数组.正则...) 二.instanceof 检测某一个实例是否属于这个类 var ary = [1,2,3,4]; ary instanceof Array   //如果true

JavaScript 学习之第一篇JavaScript的数据类型(2016/8/29 晚 23:12)

1. JavaScript的数据类型 JavaScript 里面有6中数据类型 Boolean String Number Undefined Null Object object(对象)类型包含了数组(arrays) 函数(functions) 以及其他一般对.  数字(Numbers) 类型可以是整型(intergers)或者浮点数(float point)类型以及特殊值NaN 和 Infinity  字符串(Strings)类型包含了空字符串 " ". 布尔值(Booleans)

JavaScript之数据类型

数据类型 JavaScript中有5种简单数据类型(也称为基本数据类型):Undefined.Null.Boolean.Number和String.还有1种复杂数据类型——Object,Object本质上是由一组无序的名值对组成的. typeof操作符 介于JavaScript是松散类型的,因此需要有一种手段来检测给定变量的数据类型——typeof就是负责提供者方面信息的操作符.对一个值使用typeof操作符可能返回下列某个字符串: ● "undefined"——如果这个值未定义: ●

JavaScript学习笔记:检测数组方法

很多时候我们需要对JavaScript中数据类型( Function . String . Number . Undefined . Boolean 和 Object )做判断.在JavaScript中提供了typeof操作符可以对这些常用的数据类型做判断.但要使用typeof来判断数据是不是一个数组,就不起作用了.那在实际生产中要如何来检测数据是不是一个数组呢? 今天的学习任务就是如何来检测一个数据是不是数组? typeof操作符 typeof 可以解决大部分数据类型的检测,如: 1 cons

JavaScript引用数据类型

JavaScript引用数据类型 引用类型 在ECMAScript中,引用类型是一种数据结构,用于将数据和功能组织在一起(它也常被称为类). Object类型 创建Object实例的方式有两种.第一种是使用new操作符后跟Object构造函数,例如; var person = new Object(); person.name = "Nicholas"; person.age = 29; 另一种方式是使用对象字面量表示法. 例如: var person = { name : "

JavaScript的数据类型有哪些?

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 7 <script> 8 9 /* 10 11 JavaScript的数据类型分为2大类:原始数据类型和引用数据类型 12 13 14 原始数据类型: 15 object 16 number 17 string 18 boolean 19 nu

JavaScript判断数据类型总结

最近做项目中遇到了一些关于javascript数据类型的判断处理,上网找了一下资料,并且亲自验证了各种数据类型的判断网页特效,在此做一个总结吧! 一.JS中的数据类型  1.数值型(Number):包括整数.浮点数. 2.布尔型(Boolean) 3.字符串型(String) 4.对象(Object) 5.数组(Array) 6.空值(Null) 7.未定义(Undefined) 二.判断一个变量的数据类型 1.数值型(number) 比较常用的判断方法是: 1 function isNumbe