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
相关推荐
masa01022 分钟前
JavaScript--JavaScript基础
开发语言·javascript
她似晚风般温柔7897 小时前
Uniapp + Vue3 + Vite +Uview + Pinia 分商家实现购物车功能(最新附源码保姆级)
开发语言·javascript·uni-app
Jiaberrr8 小时前
前端实战:使用JS和Canvas实现运算图形验证码(uniapp、微信小程序同样可用)
前端·javascript·vue.js·微信小程序·uni-app
everyStudy8 小时前
JS中判断字符串中是否包含指定字符
开发语言·前端·javascript
Ylucius8 小时前
动态语言? 静态语言? ------区别何在?java,js,c,c++,python分给是静态or动态语言?
java·c语言·javascript·c++·python·学习
200不是二百9 小时前
Vuex详解
前端·javascript·vue.js
LvManBa9 小时前
Vue学习记录之三(ref全家桶)
javascript·vue.js·学习
深情废杨杨9 小时前
前端vue-父传子
前端·javascript·vue.js
司篂篂11 小时前
axios二次封装
前端·javascript·vue.js
姚*鸿的博客11 小时前
pinia在vue3中的使用
前端·javascript·vue.js