JavaScript知识点讲解——包装类

JavaScript中的包装类是指可以将基本数据类型(如字符串、数值和布尔值)转换为对象的类。这些类分别是:String、Number和Boolean。

当基本类型的值调用其对应包装类的方法时,JavaScript会自动将基本类型的值转换为该包装类的对象,并在该对象上调用方法。调用完成后,对象会被销毁,重新变成基本类型的值。

数据类型

  • 原始类型:值直接存在调用栈中

在JavaScript中,原始类型指的是不能被修改的简单数据类型,包括:

  1. 数字(Number)
  2. 布尔值(Boolean)
  3. 字符串(String)
  4. 空值(Null)
  5. 未定义(Undefined)
  6. ES6引入的Symbol类型

这些原始类型的值直接存储在变量或常量中,并被保存在调用栈中。它们的值不能被修改,操作它们会返回一个新的值。

需要注意的是,NullUndefined是JavaScript中的特殊类型,表示空值和未定义的值。它们的使用场景略有不同,Null通常用于显式地表示一个空值,而Undefined则表示一个未定义的值。

  • 引用类型:值存在堆中,在调用栈里存放的只是堆中的引用地址

在JavaScript中,引用类型是一种复杂的数据类型,它可以存储多个值或者其他对象,并且可以通过引用来访问和操作这些值或对象。

常见的引用类型包括:

  1. 对象(Object)
  2. 数组(Array)
  3. 函数(Function)
  4. 正则表达式(RegExp)

引用类型的特点是它们的值存储在堆内存中,而变量中存储的只是对堆内存中的地址的引用。这意味着对引用类型的操作实际上是在操作引用,而不是直接操作值本身。

需要注意的是,在JavaScript中,函数也是一种特殊的对象,可以拥有属性和方法。因此,函数也可以被认为是一种引用类型。

对象的创建

  1. 对象字面量(Object Literal):使用大括号 {} 创建一个对象,并在大括号内部定义属性和方法。
  2. 构造函数(Constructor):通过定义一个构造函数,使用 new 关键字创建对象的实例。构造函数通常以大写字母开头,习惯上与类名相似
  3. 原型链(Prototype):使用原型链创建对象时,可以将共享的属性和方法定义在构造函数的原型对象上,从而实现对象之间的共享。
  4. ES6中的类(Class):ES6引入了类的概念,可以使用关键字 class 定义一个类,并使用 new 关键字创建对象的实例。

new的过程

  1. 创建一个新对象:当使用 new 关键字调用构造函数时,会创建一个新的空对象。
  2. 将新对象的原型链接到构造函数的原型:新创建的对象会被赋予一个特殊的内部属性 [[Prototype]](在一些浏览器中也可以通过 __proto__ 访问),该属性会指向构造函数的 prototype 属性。
  3. 在新对象上执行构造函数:将构造函数内部的 this 指向新创建的对象,并执行构造函数内部的代码。在构造函数内部可以给新对象添加属性和方法。
  4. 返回新对象:如果构造函数内部没有显式返回其他对象,则会默认返回新创建的对象实例。
ini 复制代码
function Person(name, age) {
this.name = name;
this.age = age;
}
var person1 = new Person("Alice", 25);

在上述示例中,new Person("Alice", 25) 的过程包括:

  1. 创建一个新的空对象 {}
  2. 将新对象的 [[Prototype]] 原型链接到 Person.prototype
  3. 在新对象上执行 Person 构造函数,将 this 指向新对象,并给新对象添加 nameage 属性。
  4. 返回新对象 person1
相关推荐
十一吖i2 小时前
vue3表格显示隐藏列全屏拖动功能
前端·javascript·vue.js
徐同保4 小时前
tailwindcss暗色主题切换
开发语言·前端·javascript
生莫甲鲁浪戴4 小时前
Android Studio新手开发第二十七天
前端·javascript·android studio
细节控菜鸡6 小时前
【2025最新】ArcGIS for JS 实现随着时间变化而变化的热力图
开发语言·javascript·arcgis
拉不动的猪7 小时前
h5后台切换检测利用visibilitychange的缺点分析
前端·javascript·面试
桃子不吃李子7 小时前
nextTick的使用
前端·javascript·vue.js
Devil枫9 小时前
HarmonyOS鸿蒙应用:仓颉语言与JavaScript核心差异深度解析
开发语言·javascript·ecmascript
惺忪97989 小时前
回调函数的概念
开发语言·前端·javascript
前端 贾公子10 小时前
Element Plus组件v-loading在el-dialog组件上使用无效
前端·javascript·vue.js
天外飞雨道沧桑10 小时前
JS/CSS实现元素样式隔离
前端·javascript·css·人工智能·ai