为了方便操作,JavaScript提供了3个特殊的引用类型:Boolean、Number和String。实际上,每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而可以调用这些类型的方法来操作数据。

var s1 = "hello javascript";
var s2 = s1.substring(2);

在上面的例子中,s1是一个字符串,是基本类型值。而s1调用了substring()方法,理论上基本类型值不是对象,它们不应该有方法的。其实,为了实现这种操作,后台已经自动完成了一系列的处理。当第二行代码访问s1时,会完成下面一系列操作:

  1. 创建String类型的一个实例;
  2. 在实例上调用指定的方法;
  3. 销毁这个实例

引用类型和基本包装类型的主要区别就是对象的生存期。使用new操作符创建的引用类型的实例,在执行流离开当前作用域之前都一直保存在内存中。而自动创建的基本包装类型的对象,则只存在于一行代码的执行瞬间,然后立即被销毁。这意味着不能在运行时为基本类型值添加属性和方法。

var s1 = "hello";
s1.name = "Jack";
alert(s1.name); // undefined

对基本包装类型的实例调用typeof会返回object,所有基本包装类型都会被转换为布尔值true

Object构造函数会根据传入值的类型返回相应的基本包装类型:

var obj1 = new Object("hello");
var obj2 = new Object(12);
var obj3 = new Object(true);
alert(obj1 instanceof String); // true
alert(obj2 instanceof Number); // true
alert(obj3 instanceof Boolean); // true

注意,使用new调用基本包装类型的构造函数,与直接调用同名的转型函数不一样:

var val = "10";
var num = Number(val); // 转型函数
alert(typeof num); // number var obj = new Number(val); // 构造函数
alert(typeof obj); // object

Boolean类型

Boolean类型是与布尔值对应的引用类型。创建Boolean类型对象:

var trueObj = new Boolean(true);
var falseObj = new Boolean(false);

Boolean类型的实例重写了valueOf()方法,返回基本类型值true或false;重写toString()方法,返回字符“true”或“false”。

在布尔表达式中使用Boolean对象时要特别注意:布尔表达式中的所有对象都会被转换为true

var falseObj = new Boolean(false);
var result = falseObj && true; // ①
alert(result); // true var falseVal = false;
result = falseVal && true; // ②
alert(result); // false

上面的例子中,首先创建了一个false值的Boolean对象falseObj。①处将falseObj与基本类型值true进行&&运算。这里特别要注意:falseObj会转换为true。所以结果为true。②处都是基本类型,进行&&运算结果为false,不需要多解释。

基本类型与引用类型的布尔值还有两个区别:

  • typeof操作符对基本类型返回“boolean”,而引用类型返回“object”
  • 使用instanceof操作符测试Boolean对象会返回true,而测试基本类型的布尔值则返回false

看下面的例子:

alert(typeof falseObj);     // object
alert(typeof falseVal); // boolean
alert(falseObj instanceof Boolean); // true
alert(falseVal instanceof Boolean); // false

Number类型

Number是与数字值对应的引用类型。创建Number类型对象:

var numObj = new Number(100);

Number类型重写了valueOf()、toLocaleString()和toString()方法,重写后valueOf()返回对象表示的基本类型的数值,另外两个方法会返回字符串形式的数值。

var num = 11;
alert(num.toString()); // "11"
alert(num.toString(2)); // "1011"
alert(num.toString(8)); // "13"
alert(num.toString(10)); // "11"
alert(num.toString(16)); // "b"

另外,Number提供了一些将数值格式化为字符串的方法。

1.toFixed()

toFixed()方法会按照指定的小数位返回值得字符串表示。

var num1 = 11;
alert(num1.toFixed(2)); // "11.00" var num2 = 11.005;
alert(num1.toFixed(2)); // "11.01"

2.toExponential()

toExponential()方法用于格式化,返回指数表示法,表示的数值的字符串形式。可以传入一个参数,指定输出结果中的小数位数。

var num = 11;
alert(num.toExponential(1)); // “1.0e+1”

3.toPrecision()

toPrecision()方法可能返回固定大小格式,也可能返回指数格式。可以接收一个参数,表示数值的所有数字的位数(不含指数部分)

var num = 99;
alert(num.toPrecision(1)); // "1e+2",即100,无法准确表示99
alert(num.toPrecision(2)); // "99"
alert(num.toPrecision(3)); // "99.0"

与Boolean类型相似,使用typeof和instanceof操作基本类型数值和引用类型数值时,得到的结果完全不同。

var numObj = new Number(11);
var numVal = 11;
alert(typeof numObj); // "object"
alert(typeof numVal); // "number"
alert(numObj instanceof Number); // true
alert(numObj instanceof Number); // false

String类型

String类型是字符串的对象包装类型,创建String类型:

var strObj = new String("hello javascript");

String类型提供了很多方法,用于完成字符串的解析和操作:

1.字符方法

两个用于访问字符串中特定字符的方法:charAt()和charCodeAt()。

  • charAt():以单字符串的形式返回给定位置的那个字符
  • charCodeAt():返回字符的编码

举例:

var strVal = "hello";
alert(strVal.char(1)); // "e"
alert(strVal.charCodeAt(1)); // "101"

2.字符串操作方法

  • concat():用于将一个或多个字符串拼接起来,返回拼接得到的新字符串,但是原来的字符串不变。

示例:

var strVal = "hello ";
var result = strVal.concat("javascript");
alert(result); // "hello javascript"
alert(strVal); // "hello "

concat()可以接收多个参数:

var result1 = strVal.concat("world", "!")
alert(result1); // "hello world!"

下面的三个方法都返回被操作字符串的子字符串,接收1或2个字符串。不同的是:

  • slice():第一个参数表示起始位置,第二个参数表示结束位置(不包含)
  • substr():第一个参数表示起始位置,第二个参数表示返回的字符个数(不包含)
  • substring():第一个参数表示起始位置,第二个参数表示子字符串最后一个字符后面的位置(不包含)

示例:

var str = "hello world";
alert(str.slice(3)); // "lo world"
alert(str.slice(3, 7)); // "lo w"
alert(str.substr(3)); // "lo world"
alert(str.substr(3, 7)); // "lo worl"
alert(str.substring(3)); // "lo world"
alert(str.substring(3, 7)); // "lo w"

当参数为负数时,上面的三个方法行为各不相同:

  • slice():将传入的负值与字符串的长度相加
  • substr():将负的第一个参数加上字符串的长度,将负的第二个参数转换为0
  • substring():将所有负值参数都转换为0

示例:

var strVal = "hello world";
alert(strVal.slice(-3)); // "rld"
alert(strVal.substr(-3)); // "rld"
alert(strVal.substring(-3));// "hello world" alert(strVal.slice(3, -4)); // "lo w"
alert(strVal.substr(3, -4));// ""
alert(strVal.substring(3, -4));// "hel"

下面对第二个参数是负值的情况作出解释,由于slice()会将第二个负的参数加上字符串的长度,所以strVal.slice(3,-4)会转换为strVal.slice(3, 7),因此返回“lo w”。substr()会将第二个参数转换为0,strVal.substr(3, -4)会转换为strVal.substr(3, 0),因此返回的是空串。substring()会将第二个负的参数转换为0,strVal.substring(3, -4)会转换为strVal.substring(3, 0),但是,substring()会将较小的数作为开始位置,将较大的数作为结束位置,因此,最终转换为strVal.substring(0, 3),所以返回结果为“hel”。

3.字符串位置方法

从字符串查找子字符串的方法:indexOf()lastIndexOf()。它们都从字符串中查找子字符串,返回子字符串的位置(如果没有找到子字符串,则返回-1),区别在于:

  • indexOf()字符串开头向后搜索子字符串
  • lastIndexOf()从字符串的末尾向前搜索子字符串

示例:

var strVal = "hello world";
alert(strVal.indexOf("o")); // 4
alert(strVal.lastIndexOf("o")); // 7

这两个方法可以接收可选的第二个参数,表示搜索的开始位置。

var strVal = "hello world";
alert(strVal.indexOf("o", 6)); // 7
alert(strVal.lastIndexOf("o", 6)); // 4

在使用第二个参数的情况下,可以通过循环来调用indexOf()或lastIndexOf()来找到所有匹配的子字符串:

var strVal = "Only hard work forever as a necessary of life; even if there is no hope of harvest, but also a calm to continue farming.";
var positions = new Array();
var pos = strVal.indexOf("o"); while(pos > -1) {
positions.push(pos);
pos = strVal.indexOf("o", pos + 1);
}
alert(positions); // 11,16,38,65,68,72,91,101,104

4.trim()

trim()会创建一个字符串的副本,删除前置及后缀的所有空格,然后返回结果。

var strVal = "   hello world    ";
var trimStrVal = strVal.trim();
alert(strVal); // " hello world "
alert(trimStrVal); // "hello world"

5.字符串大小写转换方法

var strVal = "heLLo woRLd";
alert(strVal.toLocaleUpperCase()); // "HELLO WORLD"
alert(strVal.toUpperCase()); // "HELLO WORLD"
alert(strVal.toLocaleLowerCase()); // "hello world"
alert(strVal.toLowerCase()) // "hello world"

6.字符串模式匹配方法

  • match()方法

看一个例子:

var text = "cat, bat, sat, fat";
var pattern = /.at/; // 与pattern.exec(text)相同
var matches = text.match(pattern);
alert(matches.index); // 0
alert(matches[0]); // "cat"
alert(pattern.lastIndex); // 0

match()接收一个正则表达式,返回一个数组,数组的第一项是与整个模式匹配的字符串,之后的每一项保存着与正则表达式中的捕获组匹配的字符串。

  • search()

search()接收一个正则表达式,返回字符串中第一个匹配项的索引;如果没有找到匹配项,则返回-1

var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
alert(pos); // 1
  • replace()

JavaScript还提供了replace()方法。该方法接收两个参数,第一个参数是RegExp对象或字符串,第二个参数可以是字符串或一个函数。当第一个参数是一个字符串时,只会替换第一个子字符串。

var text = "cat, bat, sat, fat";
var result = text.replace("at", "ond");
alert(result); // cond, bat, sat, fat result = text.replace(/at/g, "ond");
alert(result); // cond, bond, sond, fond

当第二个参数是一个函数时,在只有一个匹配项的情况下,会向这个函数传递3个参数:模式的匹配项模式匹配项在字符串中的位置原始字符串。在正则表达式中定义了多个捕获组的情况下,传递给函数的参数一次是模式的匹配项、第一个捕获组的匹配项、第二个捕获组的匹配项……,但
最后两个参数仍然分别是模式匹配项在字符串中的位置和原始字符串。

function htmlEscape(text) {
return text.replace(/[<>"&]/g, function(match, pos, originalText) {
switch (match) {
case "<":
return "&lt;";
case ">":
return "&gt;";
case "&":
return "&amp;";
case "\"":
return "&quot;";
}
});
}
alert(htmlEscape("<p class=\"greeting\">Hello world!</p>"));
// &lt;p class=&quot;greeting&quot;&gt;Hello world!&lt;/p&gt;
  • split()

split()可以指定基于指定的分隔符将一个字符串分割成多个子字符串,并将结果放在一个数组中。

var colorText = "red, blue, green, yellow";
var colors1 = colorText.split(",");
alert(colors1); // ["red", "blue", "green", "yellow"]

split()还可以接收可选的第二个参数, 用于指定数组的大小。

var colors2 = colorText.split(",", 2);  //   ["red", "blue"]

7.localeCompare()方法

localeCompare()用于比较两个字符串,并返回下列结果之一:

  • 如果字符串在字母表中应该排在字符串参数之前,则返回一个负数(多数情况为-1,具体由实现而定)
  • 如果字符串等于字符串的参数,则返回0;
  • 如果字符串在字母表中应该排在字符串参数之后,则返回一个整数(多数情况为1,具体由实现而定)

下面看一个例子:

var strVal = "yellow";
alert(strVal.localeCompare("brick")); // -1
alert(strVal.localeCompare("yellow")); // 0
alert(strVal.localeCompare("zoo")); // 1

8.fromCharCode()

String构造函数本身有一个静态方法:fromCharCode()。这个方法的任务是接收一或多个字符编码,然后将它们转换成一个字符串。

alert(String.fromCharCode(104, 101, 108, 108, 111));    // "hello"

JavaScript:基本包装类型的更多相关文章

  1. 第一百零七节,JavaScript基本包装类型,数据类型的方法

    JavaScript基本包装类型,数据类型的方法 学习要点: 1.基本包装类型概述 2.Boolean类型 3.Number类型 4.String类型 为了便于操作基本类型值,ECMAScript提供 ...

  2. JavaScript 基本包装类型,包装对象

    前言 javascript对象是一种复合值,它是属性或已命名值的集合.通过'.'符号来引用属性值.当属性值是一个函数时,称其为方法.通过o.m()来调用对象o中的方法.我们发现,字符串也同样具有属性和 ...

  3. javascript——基本包装类型

    <script type="text/javascript"> //1.Boolean 类型 //2.Number 类型 //3.String 类型 //Boolean ...

  4. javaScript对象-基本包装类型的详解

    本人按书上的内容大致地把javaScript对象划分成“引用类型”.“基本包装类型”和“内置对象”三块内容. 我们这篇先了解下基本包装类型的详细用法吧! 一.我们先解下相关概念: 1.引用类型的值(对 ...

  5. javascript之基本包装类型(Boolean,Number,String)基础篇

    前几天整理了javascript中Array方面的知识,但是String中的一些方法多多少少和Array里的方法有些类似容易混淆,就顺便连同String所在的包装类一起整理一下,希望可以帮助到初学者, ...

  6. 《JavaScript 闯关记》之基本包装类型

    为了便于操作基本类型值,JavaScript 还提供了3个特殊的引用类型:Boolean.Number 和 String.实际上,每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象 ...

  7. 《JavaScript高级程序设计》读书笔记 ---基本包装类型

    为了便于操作基本类型值,ECMAScript 还提供了3 个特殊的引用类型:Boolean.Number 和String.这些类型与本章介绍的其他引用类型相似,但同时也具有与各自的基本类型相应的特殊行 ...

  8. javascript 之基本包装类型--04

    基本包装类型 基本包装类型是特殊的引用类型.每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而可以调用属性.方法来进行后续操作. ECMAScript还提供了三种基本包装类型 ...

  9. JavaScript(第十二天)【基本包装类型】

    1.基本包装类型概述 2.Boolean类型 3.Number类型 4.String类型 为了便于操作基本类型值,ECMAScript提供了3个特殊的引用类型:Boolean.Number和Strin ...

随机推荐

  1. hdu1540线段树连续区间

    模板题>.<当初学了一波又忘了 #include<map> #include<set> #include<cmath> #include<queu ...

  2. Java笔试之输入输出

    在校招笔试中,有的时候我们要自己设计输入输出,下面罗列一些常见的输入输出: 首先把输入包加载进来: import java.util.* ; 一 ,输入 1,输入一个整数,浮点数,输入一个数组 : p ...

  3. Post with HttpClient4

    转载:http://www.cnblogs.com/luxiaoxun/p/6165237.html 作者:阿凡卢 出处:http://www.cnblogs.com/luxiaoxun/ HttpC ...

  4. wordpress启动

    wordpress启动 公司需要使用到wordpress 特意下载源码进行研究,才发现里面都是.php文件,需要运行php而不得不去配置运行环境 步骤如下 Wampserver32 使用的360安装的 ...

  5. js中字符串与数组的相互转换

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  6. NEU 1497 Kid and Ants 思路 难度:0

    问题 I: Kid and Ants 时间限制: 1 Sec  内存限制: 128 MB提交: 42  解决: 33[提交][状态][讨论版] 题目描述 Kid likes interest ques ...

  7. 快速切题 poj 1002 487-3279 按规则处理 模拟 难度:0

    487-3279 Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 247781   Accepted: 44015 Descr ...

  8. bzoj3600

    题解: 好像是什么替罪羊树 然后看了几个题解 然后就抄了一边 代码: #include<bits/stdc++.h> using namespace std; ; int n,m,rt,R ...

  9. hdu 6038 Function

    Function Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)Total ...

  10. js判断是否是移动端(触摸屏)或者是PC

    js代码: console.log("ontouchstart" in window); 手机web浏览器,chrome模拟手机.手机APP会返回true, pc端(非手机模拟状态 ...