js基础精讲——也许你不懂的数据类型2

上一篇《js基础精讲------也许你不懂的数据类型1》我们列举了JavaScript所有的简单数据,现在我们来详细讲讲这些简单数据类型都有哪些值得关注的地方。

undefined

undefined 是一个原始值(primitive value)以及一个数据类型。当一个变量被声明但未被赋值时,该变量的默认值就是 undefined。此外,如果尝试访问对象上不存在的属性或数组中不存在的索引,也会返回 undefined。

以下是一些示例来说明 undefined 的使用和表现:

变量声明但未赋值

javascript 复制代码
let myVariable;
console.log(myVariable); // 输出: undefined

访问未定义的变量

直接访问未声明的变量会导致引用错误(ReferenceError),但如果通过 typeof 操作符检查,则会返回 "undefined":

javascript 复制代码
console.log(typeof notDefined); // 输出: "undefined"
// console.log(notDefined); // 会抛出 ReferenceError

对象属性不存在

javascript 复制代码
const obj = { name: 'Alice' };
console.log(obj.age); // 输出: undefined

数组索引不存在

javascript 复制代码
const array = [1, 2, 3];
console.log(array[3]); // 输出: undefined

函数参数未提供

当调用函数时,如果提供的参数少于预期,未提供的参数将被视为 undefined:

javascript 复制代码
function greet(name) {
    console.log('Hello, ' + name);
}
greet(); // 输出: Hello, undefined

函数没有返回值

如果没有显式地返回一个值,函数默认返回 undefined:

javascript 复制代码
function doSomething() {
    // 没有 return 语句
}
console.log(doSomething()); // 输出: undefined

使用 undefined 类型

undefined 也是一个类型,可以用来检查一个值是否是 undefined:

javascript 复制代码
let myVariable;
if (myVariable === undefined) {
    console.log('myVariable is undefined');
} else {
    console.log('myVariable is defined');
}

需要注意的是,虽然可以将 undefined 赋值给变量,但在实际开发中通常不推荐这样做,因为它可能会导致代码难以理解和维护。在严格模式下(使用 'use strict';),给 undefined 赋值将会引发一个错误,因为 undefined 是一个只读的全局属性。

null

null 是一个表示"无"的特殊值。它用于表示某个变量没有指向任何对象或值。null 被认为是一个空的或者不存在的对象引用。

以下是 null 的一些使用场景:

  1. 初始化变量:
  • 在声明变量时,如果不确定初始值,可以将其设置为 null。

    javascript 复制代码
    let user = null;
  1. 清除引用:
  • 当不再需要某个对象引用时,可以将其设置为 null,帮助垃圾回收器回收内存。

    javascript 复制代码
    let largeObject = { /* 大对象 */ };
    largeObject = null; // 清除引用
  1. 函数参数:
  • 在函数参数中,可以使用 null 表示某个参数没有提供值。

    javascript 复制代码
    function printMessage(message = null) {
        if (message === null) {
            console.log("No message provided");
        } else {
            console.log(message);
        }
    }
    
    printMessage(); // "No message provided"
    printMessage("Hello"); // "Hello"
  1. 条件判断:
  • 在条件判断中,可以检查一个变量是否为 null。

    javascript 复制代码
    let value = null;
    if (value === null) {
        console.log("The value is null");
    }

为什么要条件判断

  • 访问 null 对象的属性或方法会导致运行时错误(例如 TypeError)。通过检查变量是否为 null,可以提前处理这种情况,避免程序崩溃。
  • 在调试过程中,检查变量是否为 null 可以帮助你快速定位问题。通过日志记录,你可以更好地理解程序的运行状态。
  • 有时你可能需要释放或重新分配资源。检查变量是否为 null 可以帮助你确定是否需要执行这些操作。
  1. 与 undefined 的区别:
  • 虽然 null 和 undefined 在某些情况下可以互换使用,但它们有本质的区别。undefined 表示一个变量已经声明但尚未被赋值的状态,而 null 是一个可以被显式赋值的值,表示"没有东西"。

Symbol

Symbol 是表示独一无二的标识符。Symbol 类型是在 ES6(ECMAScript 2015)中引入的,主要目的是为了创建唯一的标识符,这些标识符可以作为对象属性的键,而不会与对象上的其他属性发生冲突。

创建 Symbol

可以通过 Symbol() 函数来创建一个新的 Symbol 值。这个函数可以接受一个可选的字符串参数,作为对 Symbol 的描述,但这并不会影响 Symbol 的唯一性。

javascript 复制代码
const sym1 = Symbol();
const sym2 = Symbol('description');

console.log(sym1); // 输出: Symbol()
console.log(sym2); // 输出: Symbol(description)

Symbol 的唯一性

每个 Symbol 都是唯一的,即使它们的描述相同:

javascript 复制代码
const sym1 = Symbol('key');
const sym2 = Symbol('key');

console.log(sym1 === sym2); // 输出: false

作为对象属性键

Symbol 最常见的用途之一是作为对象属性的键,这样可以确保这些属性不会与其他属性发生冲突,也不会被意外地修改或覆盖。

javascript 复制代码
const id = Symbol('id');
const user = {
    name: 'Alice',
    [id]: 12345
};

console.log(user[id]); // 输出: 12345
console.log(user); // 输出: { name: 'Alice', [Symbol(id)]: 12345 }

全局 Symbol 注册表

如果你需要在不同的上下文中共享同一个 Symbol,可以使用全局 Symbol 注册表。这可以通过 Symbol.for(key) 方法实现,该方法会根据给定的 key 查找或创建一个 Symbol。

javascript 复制代码
const sym1 = Symbol.for('key');
const sym2 = Symbol.for('key');

console.log(sym1 === sym2); // 输出: true

内置的 Symbol 值

JavaScript 还提供了一些内置的 Symbol 值,这些值用于特定的操作或属性。例如:

  • Symbol.iterator:用于定义对象的默认迭代器。
  • Symbol.toPrimitive:用于定义对象转换为原始值的行为。
  • Symbol.hasInstance:用于定义 instanceof 操作符的行为。
javascript 复制代码
const obj = {
    [Symbol.toPrimitive](hint) {
        if (hint === 'number') {
            return 123;
        }
        return 'default';
    }
};

console.log(+obj); // 输出: 123
console.log(obj + ''); // 输出: default

bigint

BigInt 是一种新的内置对象,用于表示任意大小的整数。BigInt 类型是在 ES11(ECMAScript 2020)中引入的,旨在解决 JavaScript 中 Number 类型的精度限制问题。Number 类型的最大安全整数是 253−1253−1(即 Number.MAX_SAFE_INTEGER),超过这个范围的整数可能会失去精度。

创建 BigInt

你可以通过在整数后面加 n 后缀或者使用 BigInt 函数来创建一个 BigInt 值。

使用 n 后缀

javascript 复制代码
const bigInt1 = 1234567890123456789012345678901234567890n;
console.log(bigInt1); // 输出: 1234567890123456789012345678901234567890n

使用 BigInt 函数

javascript 复制代码
const bigInt2 = BigInt("1234567890123456789012345678901234567890");
console.log(bigInt2); // 输出: 1234567890123456789012345678901234567890n

BigInt 和 Number 的运算

BigInt 和 Number 之间不能直接进行算术运算,否则会抛出类型错误。

javascript 复制代码
const num = 123;
const bigInt = 456n;

console.log(num + bigInt);
// 这会抛出 TypeError

// 需要先将其中一个转换为另一个类型
console.log(BigInt(num) + bigInt); // 输出: 579n

BigInt 的操作

BigInt 支持大多数常见的算术运算符,包括加法、减法、乘法、除法和取模等。(这里应该不需要举例了吧)

结语

每种数据类型都有其独特的特性和应用场景,了解这些特性有助于编写更高效、更健壮的代码。在实际开发中,正确选择和使用数据类型对于构建高质量的应用程序至关重要。至于剩下的简单数据类型number string boolean本篇就不作介绍了,我认为你有能力轻松掌握,加油!

点个赞再走吧~

相关推荐
定栓7 小时前
Webpack迁到Vite第一节:模块系统迁移:require → import
运维·前端·webpack
小熊在忙fpga7 小时前
N32G430芯片的flash表示
前端·javascript·html
Data analyse4567 小时前
App埋点版本兼容的字段迁移校验
大数据·运维·服务器·前端·数据库·数据分析
NC 王炸7 小时前
AI 做的便签,换个浏览器就没了?加一个导出按钮,把数据带走
javascript·ai编程·数据备份·localstorage·txt导出
todoitbo7 小时前
本来只想给内网开个口子,Natapp 却多给了一道防护
前端·javascript·vue.js·内网穿透·网络防护·natapp
会灭火的程序员7 小时前
SuperMap AgentX Server智能体接入WEB应用技术文档
前端·supermap·agentx·agentx server
CRMEB8 小时前
商品 SKU 设计,从简单规格到多规格踩过什么
java·前端·数据库·开源
Chloe.Zz8 小时前
一篇入门Agent
开发语言·前端·javascript
java1234_小锋8 小时前
【技术专题】HTML5 网页技术 - HTML5 表格标签
前端·html·html5
silvamux_8 小时前
4款新模型商务邮件翻译横评:0.98到0.46
android·java·javascript