JS中基本包装类型说明需求文档

2021-07-16 05:15

阅读:638

标签:js 类包装 javascript

为了便于操作基本类型值,ES还提供了三种特殊的引用类型,即(基本包装类型):Number,String,Boolean。这三种类型与前面介绍的引用类型相似,但同时也拥有基本数据类型的一些特性。

平时经常看到人家代码里创建了一个字符串/数字类型,然后使用字符串/数字类型的一些方法,比如,split()、substring()等等,搞得我们误以为基本包装类型拥有的方法。其实,我们这种理解是错误的。实际上,当我们操作基本包装类型数据时,在后台就会悄悄的创建一个对应的基本包装类型的对象。因为是对象呀,所以我们才能够调用对象所拥有的方法。

举个例子:

var str = "hello,1024idea";
var strSub = str.substring(2,7);
console.log(strSub);//llo,1

执行上面代码,其实,在后台会执行如下步骤:

  1. 创建基本包装类型的对象实例

  2. 调用对象实例的函数

  3. 销毁这个对象

如下所示:

var str = "hello,1024idea";
var strObj = new String(str);
var strObjSub = strObj.substring(2,7);
strObj.null;
console.log(strObjSub);//llo,1

引用类型与基本包装类型的区别:在于对象的生命周期。

使用new关键字创建的引用类型的实例,对象在当前作用域都存在。而基本包装类型自动创建的对象则在对象被调用的时刻存在,调用完毕后,就被销毁不存在了。

Object()构造函数,可以根据你传入的参数的类型,返回基本包装类型的实例。你传入字符串,则返回String类型的实例;传入数字,则返回Number类型的实例;传入布尔值,则返回Boolean类型实例。如:

var obj = new Object("hello,1024idea");
console.log(obj instanceof String);// true

注意:使用new关键字创建的构造函数与使用同名的转型函数的效果是不一样的。如:

// 构造函数与转型函数返回值的区别
var str = "1024";

var strObj = new String(str);
console.log(typeof strObj);//object

var strNum = Number(str);
console.log(typeof strNum);//number

这个例子中,变量strObj保存的是object类型,而变量strNum保存的是number类型。

一般情况下,是不建议手动的去创建基本包装类型的对象,因为这样经常造成的问题是,分不清自己是在处理基本包装类型还是引用类型。

 


Boolean类型

Boolean类型是布尔值创建的引用类型。创建Boolean类型,可以使用Boolean构造函数去创建,并传入true或者false参数。如:

var booleanObject = new Boolean(true);

注意:在布尔表达式中使用Boolean对象,我们可能会出错的一些地方,如:

var booleanObj = new Boolean(false);
var result = booleanObj && true;
console.log(result);

你觉得上面会打印出什么结果呢?大多数人可能会说是false,因为一真一假嘛,所以为false。但是,事实上结果是true,因为booleanObj是一个对象,在布尔表达式中,所有的对象都会被转换为true。记住:引用类型的布尔值,其实是对象。

当然,我们不推荐这么用(不推荐用引用类型的布尔值来判断布尔表达式)

                             爱创课堂--专业前端技术培训

                                                         年薪30万不是梦


Number 类型

Number类型是数字值创建的引用类型。创建Number类型,使用Number类型的构造函数,可以传递数字值参数,如:

var numberObj = new Number(1024);

这里介绍一个Number类型的一个方法:numberObj.toFixed();可以接受一个数值,表示保留的小数的个数(会自动四舍五入)。在平时项目中,我们经常要处理价格问题或者增长率问题,即保留多少为小数,用这个方法非常有效。

// Number 类型
var numberObj = new Number(1024.153);
console.log(numberObj.toFixed(2));//1024.15
console.log(numberObj.toFixed(1));//1024.2

 


String类型

String类型是字符串值创建的引用类型。

String类型创建的方式,使用String构造函数创建,可以传入字符串参数;如:

var stringOjb = new String(“hello,1024idea”);

String类型的每个实例都有一个length属性,用于计算字符串的长度(即字符串中包含多少个字符)。

字符方法:charAt(),charCodeAt(),接受一个数字参数,返回某个数字索引位置的字符或字符编码。

在ES5还定义了另一个访问字符串中某个字符的方法,在支持ES5的浏览器中,可以用方括号[]来访问。

// String类型
var str = "hello,1024idea";
console.log(str.charAt(4));//o
console.log(str.charCodeAt(4));//111
console.log(str[4]);//o

字符串的操作方法:concat(),可以将多个字符串连接起来。返回得到的新字符串。

var str1 = "hello,";
var str2 = str1.concat("1024idea");
console.log(str2);//hello,1024idea

其实,实践中,我们平时用的多的还是用“+”去拼接字符串。

split() 将字符串用某个分隔符分割,返回数组。你也可以传入一个参数,即“分隔符”。

slice(),substring(),substr().这三个是截取字符串的函数。其中,slice()跟substring()非常类似,第一个参数都是截取的起始位置,第二个参数是截取的终止位置;而substr()第一个参数是起始位置,第二个参数则是需要截取的长度。
这三个函数,都不改变原本的字符串,只是在原先的字符串上创建了一个副本。返回操作副本后的值。

字符串的位置方法:indexOf(),lastIndexOf();从索引0的位置开始查询子字符串/从最后一个索引开始查找字符串。如果找到,则返回子字符串的位置,如果没有找到,返回-1;第一个参数为要查找的子字符串,第二个参数 可选的,如果有,则表示从某个位置开始查找。

ES5中还定义了trim()方法,去除字符串的开头和结尾的所有空格。此外,对于firefox,safari,chrome的后面的一些版本中,还支持非标准的trimLeft()和trimRight()方法,用于删除字符串的开头空格或结尾空格。

字符串的大小写转换方法:toLowerCase(),toUpperCase();


JS中基本包装类型说明需求文档

标签:js 类包装 javascript

原文地址:http://13031109.blog.51cto.com/13021109/1941300


评论


亲,登录后才可以留言!