5.6 JS中基本包装类型

为了便于操作基本类型值,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 str2 = new String(str);
var strSub = str2.substring(2,7);
str2.null;
console.log(strSub);//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。记住:引用类型的布尔值,其实是对象。

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



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

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

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

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

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

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

时间: 2024-08-10 17:04:55

5.6 JS中基本包装类型的相关文章

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

为了便于操作基本类型值,ES还提供了三种特殊的引用类型,即(基本包装类型):Number,String,Boolean.这三种类型与前面介绍的引用类型相似,但同时也拥有基本数据类型的一些特性. 平时经常看到人家代码里创建了一个字符串/数字类型,然后使用字符串/数字类型的一些方法,比如,split().substring()等等,搞得我们误以为基本包装类型拥有的方法.其实,我们这种理解是错误的.实际上,当我们操作基本包装类型数据时,在后台就会悄悄的创建一个对应的基本包装类型的对象.因为是对象呀,所

js中基本包装类型详情

基本包装类型 基本包装类型有Boolean,Number和string类型,每当读取一个基本类型值时,后台就会创建一个对应的基本包装类型对象. 从逻辑上,基本类型值不是对象,没有方法,但从技术上来看,当读取一个基本类型值时,后台会自动运行下面的过程: 创建一个基本包装类型Boolean,Number,String类型的一个实例 在实例上调用指定的方法 销毁基本包装类型实例 可以将上面的过程想象为下面的代码: var s1 = new String("some text");// Boo

Ext.js 中 25种类型的Ext.panel.Tool

通过Ext.panel.Panel的tools配置项来设置Ext.panel.Tool实例. 要注意的一点是,Ext框架提供的Ext.panel.Tool仅包含按钮图标而具体的点击事件处理函数需要我们自定义. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51

JS复习—基本包装类型(String、Number)、内置对象

   包装类型 在读取模式下访问基本类型值时,就会创建对应的基本包装类型的一个对象,从而方便了数据操作.每个包装类型都映射到同名的基本类型.操作基本类型值得语句一经执行完毕,就会立即销毁新创建的包装对象. 后台执行的操作: (1)创建一个String类型的一个实例: (2) 在实例上调用指定的方法 (3)销毁这个实例 var s1 = "some text"; var s2 = s1.substring(2); s1 = null; 一.Number类型 (1):valueOf() 返

jquery ajax中支持哪些返回类型以及js中判断一个类型常用的方法?

1 jquery ajax中支持哪些返回类型在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get(). 预期服务器返回的数据类型.如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML.在 1.4 中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本.随后服务器端返回的数据会根据这个值解析后,传递给回调 函数.可用值: •"xml": 返回

JS中的各种类型转换规则(转)

JS中的类型转换非常恶心,大家都懂的,不过该学还是要学. 今天看犀牛书看到了转换规则,总结出来. X转字符串.数字.布尔值 X表示各种类型的值,直接上图: 值 转数字 转字符串 转布尔值 undefined NaN “undefined” false null 0 “null” false true 1 “true”   false 0 “false”   0   “0” false -0   “0” false NaN   “NaN” false Infinity   “Infinity” t

js中对象的类型

js中的类型分为三种,"内部对象"."宿主对象"."自定义对象" 1."内部对象"有Date.Function.Array.Regexp.Number.Object.String.Math.Global.Boolean, 还有各种错误类对象,包括Error.EvalError.RangeError.ReferenceError.SyntaxError和TypeError. "Global"."Ma

js中的变量类型

js 中输出定义变量的类型  typeof  变量名. var u:  --underfined类型 var s = "你是一个好人":   --string类型 var n = 10;   --number类型 var  num = NaN;  --number 类型,not a number. var  n = null:   -- object类型 var d = new Date();   --时间 var a = new Array();   --数组

js中的number类型

NaN有两个特点: 1 任何涉及NAN的操作都会返回NaN(这个特点在多步计算中可能有问题) 2NaN与任何值都不相等,包括它本身,例如下面的代码也是返回false alert(NaN == NaN) 针对NaN的这两个特点,ECMAscript定义了isNaN()这个函数,该函数接收一个参数,该参数可以是任意数据类型,而且该参数可以帮我们确定这个参数是否“不是数值”.isNaN() 接收到一个值之后会将这个值转换成数值.而某些不会转换为数值的值都将返回true 数值转换 js中数值转换的函数有