JavaScript基础之基于数据类型和引用数据类型

news/2024/11/16 19:38:02/

原文合集地址如下,有需要的朋友可以关注

本文地址

数据类型

JavaScript的数据类型有7中,包括6个基本类型和一个引用类型
基本数据类型:number, string, boolean, null, undefined, symbol
引用数据类型:object(数组、对象、函数、正则等)

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

  • 存储方式
    基本类型:基本数据类型的值直接存储在改变量所分配的内存空间中,它们是简单数据类型,占用的空间小
    引用类型:引用数据类型的值存储在堆内存中,变量存储的是对象在堆内存的地址,而不是实际的值,所以引用数据的大小不固定, 可以包含大量数据。
  • 赋值行为
    基本类型:将一个基本数据类型赋值给另一个变量,直接将该值的副本赋值给新的变量
    引用类型:而将引用数据类型的变量赋值给另一个变量,是将该引用类型的地址给另一个变量,不是直接的值,两个变量指向同一个数据,当修改另一个变量时,此变量的值也会跟着变。
  • 比较方式
    基本数据类型:基本数据类型的值通过它们的实际值进行比较。
    引用数据类型:引用数据类型的值比较的是它们在内存中的地址(引用),而不是实际的值。因此,即使两个对象具有相同的属性和值,它们在内存中是不同的对象,比较结果会是 false。

基本数据类型:

let num1 = 42;
let num2 = num1; // 复制值,num2 现在是 42 的副本
num1 = 100; // 修改 num1 的值不会影响 num2console.log(num1); // 输出 100
console.log(num2); // 输出 42

引用数据类型:

const obj1 = { name: "John" };
const obj2 = obj1; // 复制引用,obj2 指向 obj1 引用的对象obj1.name = "Alice"; // 修改 obj1 的属性,也会影响 obj2console.log(obj1.name); // 输出 "Alice"
console.log(obj2.name); // 输出 "Alice",因为 obj2 指向与 obj1 相同的对象

判断变量的数据类型

typeof

typeof运算符用来获取数据的类型。但是对于 null 返回的是 “object”,这是历史遗留问题,可能会导致误判。
对于函数返回的是 “function”,但函数也是对象的一种,因此不能准确区分一个变量是简单的函数还是其他类型的对象。

typeof "hello" // 返回 "string"
typeof 42 // 返回 "number"
typeof true // 返回 "boolean"
typeof undefined // 返回 "undefined"
typeof null // 返回 "object"
typeof [] // 返回 "object"
typeof {} // 返回 "object"
typeof function(){} // 返回 "function"

instanceof

instanceof 运算符用于检查一个对象是否属于某个特定类的实例。
但是它只能判断赋复杂数据类型,不能判断基本数据类型。

const myArray = [];
const myDate = new Date();console.log(myArray instanceof Array); // 输出 true
console.log(myArray instanceof Object); // 输出 true,因为 Array 是 Object 的子类
console.log(myDate instanceof Date); // 输出 true
console.log(myDate instanceof Object); // 输出 true,因为 Date 是 Object 的子类

Array.isArray()

Array.isArray()用于判断值是否为数组类型。

console.log(Array.isArray([])); // 输出 true
console.log(Array.isArray({})); // 输出 false

Object.prototype.toString.call()

使用 Object.prototype.toString.call() 方法:这是一种通用的方法,可以检测几乎所有的数据类型。

console.log(Object.prototype.toString.call("hello")); // 输出 "[object String]"
console.log(Object.prototype.toString.call(42)); // 输出 "[object Number]"
console.log(Object.prototype.toString.call(true)); // 输出 "[object Boolean]"
console.log(Object.prototype.toString.call(undefined)); // 输出 "[object Undefined]"
console.log(Object.prototype.toString.call(null)); // 输出 "[object Null]"
console.log(Object.prototype.toString.call([])); // 输出 "[object Array]"
console.log(Object.prototype.toString.call({})); // 输出 "[object Object]"
console.log(Object.prototype.toString.call(function () {})); // 输出 "[object Function]"
console.log(Object.prototype.toString.call(new Date())); // 输出 "[object Date]"

虽然上述方法在很多情况下可以满足数据类型判断的需求,但它们也有一些弊端需要注意:

  1. typeof 的问题:

    • 对于 null 返回的是 "object",这是历史遗留问题,可能会导致误判。例如,无法准确判断一个变量是 null 还是对象。
    • 对于函数返回的是 "function",但函数也是对象的一种,因此不能准确区分一个变量是简单的函数还是其他类型的对象。
  2. instanceof 的问题:

    • instanceof 只能检测对象类型,并且还要考虑原型链。如果对象是在不同的全局上下文中创建的,或者涉及多个框架,instanceof 可能会失效。
    • 不能判断基本数据类型,如字符串、数字、布尔值等。
  3. Array.isArray() 的问题:

    • Array.isArray() 只能判断数组类型,不能判断其他对象类型。
  4. Object.prototype.toString.call() 的问题:

    • 这种方法虽然可以准确判断大部分类型,但使用起来较为繁琐,需要额外的调用,并且不够直观。
    • 如果出现自定义类的实例,Object.prototype.toString.call() 只会返回 "[object Object]",无法具体判断其属于哪个类。

封装判断变量的数据类型函数

这里分别用了typeof和Object.prototype.toString.call()方法。

/*** @param 要判断类型的值* @returns 数据类型*/
export const getDataType = (value: any) => {if (typeof value === "object") {if (value === null) return "null";if (Array.isArray(value)) return "array";return "object";}return typeof value;
};export const getDataType2 = (value: any) => {const type = Object.prototype.toString.call(value);if (type === "[object String]") return "string";if (type === "[object Number]") return "number";if (type === "[object Boolean]") return "boolean";if (type === "[object Undefined]") return "undefined";if (type === "[object Null]") return "null";if (type === "[object Array]") return "array";if (type === "[object Object]") return "object";if (type === "[object Function]") return "function";if (type === "[Object Date]") return "date";
};

http://www.ppmy.cn/news/1028035.html

相关文章

Linux命令 -- vim

Linux命令 -- vim 前言一般模式光标移动复制粘贴内容查找 底线命令行模式 前言 用vim指令进入文件。 刚进入时是命令行模式,也叫一般模式。 按i或者insert进入编辑模式,此时可以编辑文件内容。 按esc可从编辑模式退回到一般模式,输入冒号进…

mysql 技术总结

一、mysql 索引(左小右大) 下图中为二叉树 mysql索引类型以及数据结构 BTREE结构 BTree又叫多路平衡搜索树,一颗m叉的BTree特性如下: 树中每个节点最多包含m个孩子。 除根节点与叶子节点外,每个节点至少有[ceil(m/2…

从零开始学Python(三)函数与lambda表达式

🥳🥳Welcome Huihuis Code World ! !🥳🥳 接下来看看由辉辉所写的关于Python的相关操作吧 目录 🥳🥳Welcome Huihuis Code World ! !🥳🥳 一.函数 1.函数与方法的区别 2.函数的定…

华为网络篇 RIP的Slient-Interface-26

难度1复杂度 1 目录 一、实验原理 二、实验拓扑 三、实验步骤 四、实验过程 总结 一、实验原理 在默认情况下,RIP会在所有的接口泛洪路由更新信息(整个路由表),这里有一个问题,当RIP路由器连接的是一个末端网络时…

8.12学习笔记

在PyTorch中,Dataset和DataLoader是用于处理数据的两个重要类。Dataset类是一个抽象类,用于表示数据集。它的主要作用是将数据加载到内存中,并提供一种统一的方式来访问数据。为了使用Dataset类,你需要继承它并实现两个方法&#…

湘大 XTU OJ:1406 String Game、1098 素数个数 题解(非常详细)

1406 String Game 一、链接 1406 String Game 二、题目 题目描述 Alice和Bob正在玩一个基于字符串的游戏,一开始,Alice和Bob分别拥有一个等长的字符串S1和S2,且这两个字符串只包含小写字母。 在每个回合中,Alice和Bob必须分…

【C语言练习】——找出单身狗、详解atoi函数

目录 一.找出单身狗版本1版本2 二.atoi函数介绍atoi函数atoi函数的模拟实现 一.找出单身狗 版本1 题目: 一个数组中只有一个数字是出现一次,其他所有数字都出现了两次 找出这一个只出现一次的数字 一个数组比如是1、2、3、4、5、1、2、3、4 只有5出现一…

Python-OpenCV中的图像处理-霍夫变换

Python-OpenCV中的图像处理-霍夫变换 霍夫变换霍夫直线变换霍夫圆环变换 霍夫变换 霍夫(Hough)变换在检测各种形状的技术中非常流行,如果要检测的形状可以用数学表达式描述,就可以是使用霍夫变换检测它。即使要检测的形状存在一点破坏或者扭曲也是可以使…