JavaScript包装类(一)

简介: 这是因为JavaScript为了可以使其可以获取属性和调用方法,对其封装了对应的包装类型;

image.png


1 认识包装类型


JavaScript的原始类型并非对象类型,所以从理论上来说,它们是没有办法获取属性或者调用方法的。但是,在开发中会看到,我们会经常这样操作:


image.png


那么,为什么会出现这样奇怪的现象呢?


  • 原始类型是简单的值,默认并不能调用属性和方法;
  • 这是因为JavaScript为了可以使其可以获取属性和调用方法,对其封装了对应的包装类型;


常见的包装类型有:String、Number、Boolean、Symbol、BigInt类型


2 包装类型的使用过程


  • 默认情况,当我们调用一个原始类型的属性或者方法时,会进行如下操作:
  • 根据原始值,创建一个原始类型对应的包装类型对象;
  • 调用对应的属性或者方法,返回一个新的值;
  • 创建的包装类对象被销毁;
  • 通常JavaScript引擎会进行很多的优化,它可以跳过创建包装类的过程在内部直接完成属性的获取或者方法的调用。
  • 我们也可以自己来创建一个包装类的对象:
  • name1是字面量(literal)的创建方式,name2是new创建对象的方式;


image.png


  • 注意事项:null、undefined没有任何的方法,也没有对应的“对象包装类”;


3 Number 类的补充


  • 前面我们已经学习了Number类型,它有一个对应的数字包装类型Number,我们来对它的方法做一些补充。
  • Number属性补充:
  • Number.MAX_SAFE_INTEGER:JavaScript 中最大的安全整数 (2^53 - 1)
  • Number.MIN_SAFE_INTEGER:JavaScript 中最小的安全整数 -(2^53 - 1)
  • Number实例方法补充:
  • 方法一:toString(base),将数字转成字符串,并且按照base进制进行转化
  • base 的范围可以从 2 到 36,默认情况下是 10;
  • 注意:如果是直接对一个数字操作,需要使用..运算符;
  • 方法二:toFixed(digits),格式化一个数字,保留digits位的小数;
  • digits的范围是0到20(包含)之间;
  • Number类方法补充:
  • 方法一:Number.parseInt(string[, radix]),将字符串解析成整数,也有对应的全局方法parseInt;
  • 方法二:Number. parseFloat(string),将字符串解析成浮点数,也有对应的全局方法parseFloat;
  • 更多Number的知识,可以查看MDN文档:


4 Math对象


  • 在除了Number类可以对数字进行处理之外,JavaScript还提供了一个Math对象。
  • Math是一个内置对象(不是一个构造函数),它拥有一些数学常数属性和数学函数方法;
  • Math常见的属性:
  • Math.PI:圆周率,约等于 3.14159;
  • Math常见的方法:
  • Math.floor:向下舍入取整
  • Math.ceil:向上舍入取整
  • Math.round:四舍五入取整
  • Math.random:生成0~1的随机数(包含0,不包含1)
  • Math.pow(x, y):返回x的y次幂
  • Math中还有很多其他数学相关的方法,可以查看MDN文档:
目录
相关文章
|
JavaScript 前端开发 索引
JavaScript包装类(二)——String类
它们的区别是索引的方式没有找到会返回undefined,而charAt没有找到会返回空字符串;
136 0
JavaScript包装类(二)——String类
|
JavaScript
js基础笔记学习194-包装类2
js基础笔记学习194-包装类2
57 0
js基础笔记学习194-包装类2
|
JavaScript
js基础笔记学习193-包装类1
js基础笔记学习193-包装类1
50 0
js基础笔记学习193-包装类1
|
JavaScript 前端开发 Java
【JavaScript】48_包装类与垃圾回收机制
# 10、包装类 在JS中,除了直接创建原始值外,也可以创建原始值的对象 通过 new String() 可以创建String类型的对象 通过 new Number() 可以创建Number类型的对象 通过 new Boolean() 可以创建Boolean类型的对象 - 但是千万不要这么做 包装类: ## JS中一共有5个包装类 String --> 字符串包装为String对象 Number --> 数值包装为Number对象 Boolean --> 布尔值包装为Boolean对象 BigInt --> 大整数包装为BigInt对象 Symbol --> 符号包装为
93 0
|
JavaScript
js辨别数据的类型(包装类)
js辨别数据的类型(包装类)
|
JavaScript 前端开发
JS 包装类
JS 包装类
129 0
|
26天前
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
25 1
JavaScript中的原型 保姆级文章一文搞懂
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
102 2
|
22天前
JS+CSS3文章内容背景黑白切换源码
JS+CSS3文章内容背景黑白切换源码是一款基于JS+CSS3制作的简单网页文章文字内容背景颜色黑白切换效果。
17 0
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
142 4