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
相关推荐
Bio Coder2 分钟前
学习用 Javascript、HTML、CSS 以及 Node.js 开发一个 uTools 插件,学习计划及其周期
javascript·学习·html·开发·utools
凹凸曼打不赢小怪兽1 小时前
react 受控组件和非受控组件
前端·javascript·react.js
忠实米线2 小时前
使用pdf-lib.js实现pdf添加自定义水印功能
前端·javascript·pdf
明辉光焱3 小时前
[Electron]总结:如何创建Electron+Element Plus的项目
前端·javascript·electron
牧码岛3 小时前
Web前端之汉字排序、sort与localeCompare的介绍、编码顺序与字典顺序的区别
前端·javascript·web·web前端
云空3 小时前
《InsCode AI IDE:编程新时代的引领者》
java·javascript·c++·ide·人工智能·python·php
咔咔库奇4 小时前
ES6基础
前端·javascript·es6
bug爱好者4 小时前
如何解决sourcetree 一打开就闪退问题
前端·javascript·vue.js
徐小夕4 小时前
Flowmix/Docx 多模态文档编辑器:V1.3.5版本,全面升级
前端·javascript·架构
迂 幵4 小时前
vue el-table 超出隐藏移入弹窗显示
javascript·vue.js·elementui