一、分类

  根据 JavaScript 中的变量类型传递方式,分为基本数据类型和引用数据类型。其中基本数据类型包括Undefined、Null、Boolean、Number、String、Symbol (ES6新增,表示独一无二的值),而引用数据类型统称为Object对象,主要包括对象、数组和函数。

二、区别

  在参数传递方式上,有所不同:

  • 函数的参数如果是简单类型,会将一个值类型的数值副本传到函数内部,函数内部不影响函数外部传递的参数变量

  • 如果是一个参数是引用类型,会将引用类型的地址值复制给传入函数的参数,函数内部修改会影响传递参数的引用对象。

  基本数据类型和引用数据类型的区别:

  • 基本类型和引用类型存储于内存的位置不同,基本类型直接存储在栈中。
  • 引用类型的对象存储在堆中,与此同时,在栈中存储了指针,而这个指针指向正是堆中实体的起始位置。

三、举例

  下面通过一个小题目,来看下两者的主要区别:

// 基本类型
var a = 10
var b = a
b = 20
console.log(a) // 10
console.log(b) // 20

  上述代码中,a b都是值类型,两者分别修改赋值,相互之间没有任何影响。再看引用类型的例子:

// 引用类型
var a = {x: 10, y: 20}
var b = a
b.x = 100
b.y = 200
console.log(a) // {x: 100, y: 200}
console.log(b) // {x: 100, y: 200}

  上述代码中,a b都是引用类型。在执行了b = a之后,修改b的属性值,a的也跟着变化。因为a和b都是引用类型,指向了同一个内存地址,即两者引用的是同一个值,因此b修改属性时,a的值随之改动

四、判断数据类型的方式

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 无效

2.instanceof

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

[] instanceof Array; //true
{} instanceof Object;//true
new Date() instanceof Date;//true
new RegExp() instanceof RegExp//true
null instanceof Null//报错
undefined instanceof undefined//报错

3.constructor

    constructor作用和instanceof非常相似。但constructor检测 Object与instanceof不一样,还可以处理基本数据类型的检测。不过函数的 constructor 是不稳定的,这个主要体现在把类的原型进行重写,在重写的过程中很有可能出现把之前的constructor给覆盖了,这样检测出来的结果就是不准确的。

4.Object.prototype.toString.call()

    Object.prototype.toString.call() 是最准确最常用的方式。

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]

JavaScript 的数据类型的更多相关文章

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

    前言:在前端开发中经常会需要用到检测变量数据类型的需求,比如:判断一个变量是否为undefined或者null来进行下一步的操作,今天在阅读“编写高质量代码-改善JavaScript程序的188个建议 ...

  2. JavaScript基础——数据类型

    JavaScript使用数据类型来确定如何处理被分配给一个变量的数据.变量的类型决定了你可以对变量进行什么操作,如循环或者执行.下面描述了最常用的变量类型. 字符串(String):此数据类型将字符数 ...

  3. JavaScript 的数据类型 相关知识点

    (1)基本数据类型介绍 JavaScript的数据类型分为两类:原始类型(primitive type)和对象类型(object type) 或者说是:可以拥有方法的类型和不能拥有方法的类型 或者说是 ...

  4. JavaScript的数据类型

    JavaScript的数据类型 1.JavaScript的数据类型包括:字符串.数值.布尔.数组.对象.Null.Undefined. 2.JavaScript拥有动态类型,这以为着同一个变量可用作不 ...

  5. JavaScript判断数据类型总结

    最近做项目中遇到了一些关于javascript数据类型的判断处理,上网找了一下资料,并且亲自验证了各种数据类型的判断网页特效,在此做一个总结吧! 一.JS中的数据类型  1.数值型(Number):包 ...

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

    1. JavaScript的数据类型 JavaScript 里面有6中数据类型 Boolean String Number Undefined Null Object object(对象)类型包含了数 ...

  7. 从头开始学JavaScript (三)——数据类型

    原文:从头开始学JavaScript (三)--数据类型 一.分类 基本数据类型:undefined.null.string.Boolean.number 复杂数据类型:object object的属 ...

  8. JavaScript基本数据类型

    JavaScript基本数据类型 在JavaScript种一共有6种数据类型:Null.Undefined.Boolean.String.Number.Object.其中Object是一种复杂数据类型 ...

  9. javaScript(4)---数据类型

    javaScript(4)---数据类型 第4章 数据类型 学习要点: 1.typeof操作符 2.Undefined类型 3.Null类型 4.Boolean类型 5.Number类型 6.Stri ...

  10. 1:Javascript的数据类型和相互转换

    第一节:JavaScript的数据类型 他是弱类型 var 但是正是由于其实弱类 所以其后台的数据类型转换也是我们值得思考的 JavaScript的数据类型有两种 一种是原始类型  另外一种是对象类型 ...

随机推荐

  1. 【MySQL】数据类型之数字相关

    " 目录 #. 数值类型 1. 数值范围验证 /. 有符号 /. 无符号 2. int类型显示长度验证 #. 浮点型 1. 验证 /. 建表 /. 精度 #. 日期类型 1. 验证 /. y ...

  2. java redis 实现用户签到功能(很普通简单的签到功能)

    业务需求是用户每天只能签到一次,而且签到后用户增加积分,所以把用户每次签到时放到redis 缓存里面,然后每天凌晨时再清除缓存,大概简单思想是这样的 直接看代码吧如下 @Transactional @ ...

  3. 洛谷 P5018 对称二叉树(搜索)

    嗯... 题目链接:https://www.luogu.org/problem/P5018 其实这道题直接搜索就可以搜满分: 首先递归把每个点作为根节点的儿子的数量初始化出来,然后看这个节点作为根节点 ...

  4. 用python计算一条射线到两个平面的交点

    前两天,一个朋友找我(半个程序猿)用python帮他写数学模型,当时的我直接是懵逼的,当听到三维啥的时候,整个人就好了,最终在周末花了3个小时把逻辑理了一遍,给小伙伴一个满意的答复了,话不多说,我来整 ...

  5. 使用Eclipse工具开发Servlet(新建web项目->创建Servlet->部署和访问Servlet)

    在Eclipse工具栏中的[File]->[New]->[Other],打开如下菜单栏,选择Dynamic Web Project 点击下一步,如下图所示: 这里Dynamic web m ...

  6. 鸡汤 - Choice is yours

    传送门 https://kamranahmed.info/blog/2018/03/24/choice-is-yours/ Our whole lives are driven by the choi ...

  7. leetcode菜鸡斗智斗勇系列(10)--- Decrypt String from Alphabet to Integer Mapping

    1.原题: https://leetcode.com/problems/decrypt-string-from-alphabet-to-integer-mapping/submissions/ Giv ...

  8. c# 调用c++sdk时结构体与byte数组互转

    /// <summary> /// 由结构体转换为byte数组 /// </summary> public static byte[] StructureToByte<T ...

  9. spring web 测试用例

    spring web 测试有三种方式 1. 自己初始化 MockMvc 2.依赖@springbootTest 它会帮你生产 webTestClient ,只需自己注入即可. 3.启动的时候,不加载整 ...

  10. mpvue路由传参报错Cannot read property 'query' of undefined

    在mpvue编写的小程序项目中,页面跳转间我希望通过编程式导航传递些参数 传参页面代码: this.$router.push({path:'/pages/login/changePassword/ma ...