zoukankan      html  css  js  c++  java
  • 第五章 引用类型

    Object类型

    大多数引用类型的值都是Object类型的实例。

    创建Object的实例:

    1.使用Object构造函数

    var person = new Object();

    person.name = "Nicholas";

    person.age = 29;

       

    2.字面量表示法(花括号)

    var person = {

    name : "Nicholas",

    age : 29

    };

    var person = {}; //new Object()相同

    通过字面量定义对象时不会调用Object构造函数

       

    属性访问

    一般使用点表示访问属性。

    JavaScript也可以使用方括号表示法来访问对象的属性。在使用方括号语法时,应该将要访问的属性

    字符串的形式放在方括号中

     

    Array类型

    两个特性:

    1.数组的每一项可以存放任何类型

    2.长度可变

       

    创建数组:

    1.使用Array()构造函数

    var colors = new Array(20);//可选参数20表示创建数组长度,每一项都是undefined

    var colors = new Array("red", "blue", "green");//初始化项

    可以省略new

    2.字面量表示法(方括号)

    var colors = ["red", "blue", "green"]; // 创建一个包含3个字符串的数组

    var names = []; // 创建一个空数组

    var values = [1,2,]; // 不要这样!这样会创建一个包含23项的数组

    var options = [,,,,,]; // 不要这样!这样会创建一个包含56项的数组

    使用字面量方法时不会调用Array构造函数

    length属性:

    保存数组的项数。

       

    数组的length属性很有特点:它不是只读的。因此,通过设置这个属性,可以从数组的末尾移除项或向数组中添加新项

       

    var colors = ["red", "blue", "green"]; // 创建一个包含3个字符串的数组

    colors.length = 2;

    alert(colors[2]); //undefined

       

    检测数组:

    1.对于一个网页或者一个全局作用域使用instanceof操作符可确定变量是不是数组。

    if (value instanceof Array){

    //对数组执行某些操作

    }

    但是如果存在多个框架,那就存在多个全局执行环境,因此存在多个版本的Array构造函数。使用instanceof无法坚持这样的数组。

    2.Array.isArray()方法

    这个方法的目的是最终确定某个值到底是不是数组,而不管它是在哪个全局执行环境中创建的。

    if (Array.isArray(value)){

    //对数组执行某些操作

    }

       

    转换方法:

    1.toString()方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。实际上调用了每个元素的toString()方法。

    var a ={

    toString:function (){return "aaa";}

    };

    var b=[a,"c"];

    var n =b.toString(); // "aaa,c"

       

    2.toLocaleString()方法

    同上,每次调用元素的toLoacleString()方法

    3.valueOf()返回的还是数组

       

    4.join()方法

    接收一个字符参数,用作字符串的分割符。

    如果没有参数,则默认逗号为分隔符。

    var colors = ["red", "green", "blue"];

    alert(colors.join(",")); //red,green,blue

    alert(colors.join("||")); //red||green||blue

       

    上述四个方法遇到null和undefined时返回空字符串。

       

    栈方法:

    让数组具有栈的特性。

       

    1.push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度

       

    2.pop()方法则从数组末尾移除最后一项,减少数组的length值,然后返回移除的项

       

    队列方法:

    1.shift(),它能够移除数组中的第一个项并返回该项,同时将数组长度减1

       

    2.push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度

       

    3.unshift()从数组前端添加任意个项,结合pop()可以模拟相反方向的队列。

       

    重排序方法:

    1.reverse()方法

    反转数组项的顺序

       

    2.sort()方法

    查看原理

    升序排序。会调用每项的toString方法,然后比较每个字符串。

       

    即使比较的是数字,也会转型为字符串,因此会出现下面情况:

    var values = [0, 1, 5, 10, 15];

    values.sort();

    alert(values); //0,1,10,15,5

       

    3.比较函数

    鉴于sort()方法的缺陷,可以向sort()方法传入一个比较函数作为参数。

       

    比较函数接收两个参数,如果第一个参数应该位于第二个之前则返回一个负数,如果两个参数相等则返回0,如果第一个参数应该位于第二个之后则返回一个正数。

       

    比较函数如下:

    function compare(value1, value2) {

    if (value1 < value2) {

    return -1;

    } else if (value1 > value2) {

    return 1;

    } else {

    return 0;

    }

    }

    var values = [0, 1, 5, 10, 15];

    values.sort(compare);

    alert(values); //0,1,5,10,15

    以上方法都会改变原始数组。

    4.操作方法

    1.concat()方法

    基于当前数组创建新数组。该方法的参数可以是元素或数组。

    将参数添加到当前数组末尾构成新的数组。

    var colors = ["red", "green", "blue"];

    var colors2 = colors.concat("yellow", ["black", "brown"]);

    alert(colors); //red,green,blue

    alert(colors2); //red,green,blue,yellow,black,brown

       

    2.slice()方法

    基于当前数组中的一或多个项创建一个新数组。

       

    slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下,slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数,该方法返回起始和结束位置之间的项—

    但不包括结束位置的项。

    注意,slice()方法不会影响原始数组。

       

    3.splice()方法

    删除:可以删除任意数量的项,只需指定2个参数:要删除的第一项的位置和要删除的项数。

    例如,splice(0,2)会删除数组中的前两项。

       

    插入:可以向指定位置插入任意数量的项,只需提供3个参数:起始位置、0(要删除的项数)

    和要插入的项。如果要插入多个项,可以再传入第四、第五,以至任意多个项。

    例如,

    splice(2,0,"red","green")会从当前数组的位置2开始插入字串"red""green"

    替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定3个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。

    例如,

    splice (2,1,"red","green")会删除当前数组位置2的项,然后再从位置2开始插入字符串"red""green"

       

    位置方法:

    indexOf()方法和lastIndexOf()方法

    返回查找项的索引

       

    迭代方法:

    every():对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true

    filter():对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组。

    forEach():对数组中的每一项运行给定函数。这个方法没有返回值。

    map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。

    some():对数组中的每一项运行给定函数,如果该函数对任一项返回true,则返回true

       

    以上方法传入两个参数,第一个是运行函数的作用域对象,第二个是每项需要运行的函数。

    函数接受三个参数:数组项的值,该项的索引,数组本身。

    举例:

    var numbers = [1,2,3,4,5,4,3,2,1];

    var filterResult = numbers.filter(function(item, index, array){

    return (item > 2);

    });

    alert(filterResult); //[3,4,5,4,3]

       

    以上方法都不会修改数组中的包含的值。

       

    归并方法:

    reduce()reduceRight()。这两个方法都会迭代数组的所有项,然后构建一个最终返回的值。其中,reduce()方法从数组的第一项开始,逐个遍历到最后。而reduceRight()则从数组的最后一项开始,向前遍历到第一项。

       

    两个方法都接收两个参数:一个在每一项上调用的函数和(可选的)作为归并基础的初始值。

       

    函数接收4个参数:前一个值、当前值、项的索引和数组对象。

    函数返回的任何值都会作为第一个参数自动传给下一项。

       

    使用reduce()方法可以执行求数组中所有值之和的操作,比如:

    var values = [1,2,3,4,5];

    var sum = values.reduce(function(prev, cur, index, array){

    return prev + cur;

    });

    alert(sum); //15

    Date类型

    创建Date对象:

    var now = new Date();

       

    1.Date.parse()方法

    接收一个表示日期的字符串参数,然后尝试根据这个字符串返回相应日期的毫秒数。

       

    2.Date.UTC()方法

    同样也返回表示日期的毫秒数,但它与Date.parse()在构建值时使用不同的息。Date.UTC()的参数分别是年份、基于0的月份(一月是0,二月是1,以此类推)、月中的哪一天(131)、小时数(023)、分钟、秒以及毫秒数。在这些参数中,只有前两个参数(年和月)是必需的。如果没有提供月中的天数,则假设天数为1;如果省略其他参数,则统统假设为0

       

    // GMT时间200011日午夜零时

    var y2k = new Date(Date.UTC(2000, 0));

       

    Date()构造函数会根据传入的参数自动调用Date.parse()Date.UTC()方法:

    var someDate = new Date("May 25, 2004"); //自动调用Date.parse()

       

    // 本地时间200555日下午5:55:55

    var allFives = new Date(2005, 4, 5, 17, 55, 55);//自动调用Date.UTC()

       

    3.Data.now()方法

    表示调用这个方法时的日期和时间的毫秒数。

       

    对象方法:

    1.toLocaleString()

    返回与浏览器相适应的日期和时间。

    2.toString()

    返回带时区信息的日期和时间。

    3.valueOf()

    返回时间的毫秒数

       

    日期格式化:

    toDateString()——以特定于实现的格式显示星期几、月、日和年;

    toTimeString()——以特定于实现的格式显示时、分、秒和时区;

    toLocaleDateString()——以特定于地区的格式显示星期几、月、日和年;

    toLocaleTimeString()——以特定于实现的格式显示时、分、秒;

    toUTCString()——以特定于实现的格式完整的UTC日期

       

    日期/时间组件方法:

    getTime() 返回表示日期的毫秒数;与valueOf()方法返回的值相同

    setTime(毫秒) 以毫秒数设置日期,会改变整个日期

    getFullYear() 取得4位数的年份(如2007而非仅07

    getUTCFullYear() 返回UTC日期的4位数年份

    setFullYear() 设置日期的年份。传入的年份值必须是4位数字(如2007而非仅07

    setUTCFullYear() 设置UTC日期的年份。传入的年份值必须是4位数字(如2007而非仅07

    getMonth() 返回日期中的月份,其中0表示一月,11表示十二月

    getUTCMonth() 返回UTC日期中的月份,其中0表示一月,11表示十二月

    setMonth() 设置日期的月份。传入的月份值必须大于0,超过11则增加年份

    setUTCMonth() 设置UTC日期的月份。传入的月份值必须大于0,超过11则增加年份

    getDate() 返回日期月份中的天数(131

    getUTCDate() 返回UTC日期月份中的天数(131

    setDate() 设置日期月份中的天数。如果传入的值超过了该月中应有的天数,则增加月份

    setUTCDate() 设置UTC日期月份中的天数。如果传入的值超过了该月中应有的天数,则增加月份

    getDay() 返回日期中星期的星期几(其中0表示星期日,6表示星期六)

    getUTCDay() 返回UTC日期中星期的星期几(其中0表示星期日,6表示星期六)

    getHours() 返回日期中的小时数(023

    getUTCHours() 返回UTC日期中的小时数(023

    setHours() 设置日期中的小时数。传入的值超过了23则增加月份中的天数

    setUTCHours() 设置UTC日期中的小时数。传入的值超过了23则增加月份中的天数

    getMinutes() 返回日期中的分钟数(059

    getUTCMinutes() 返回UTC日期中的分钟数(059

    setMinutes() 设置日期中的分钟数。传入的值超过59则增加小时数

    setUTCMinutes() 设置UTC日期中的分钟数。传入的值超过59则增加小时数

    getSeconds() 返回日期中的秒数(059

    getUTCSeconds() 返回UTC日期中的秒数(059

    setSeconds() 设置日期中的秒数。传入的值超过了59会增加分钟数

    setUTCSeconds() 设置UTC日期中的秒数。传入的值超过了59会增加分钟数

    getMilliseconds() 返回日期中的毫秒数

    getUTCMilliseconds() 返回UTC日期中的毫秒数

    setMilliseconds(毫秒) 设置日期中的毫秒数

    setUTCMilliseconds(毫秒) 设置UTC日期中的毫秒数

    getTimezoneOffset() 返回本地时间与UTC时间相差的分钟数。例如,美国东部标准时间返回300。在某

    地进入夏令时的情况下,这个值会有所变化

    RegExp类型

    格式:

    1.字面量定义

    var expression = /pattern/ flags ;

       

    var pattern1 = /[bc]at/i;

       

    2.构造函数定义

    var pattern2 = new RegExp("[bc]at", "i")

       

    正则表达式字面量始终会共享同一个RegExp实例,而使用构造函数创建的每一个新RegExp实例都是一个新实例。

       

    g:表示全局(global)模式,即模式将被应用于所有字符串,而非在发现第一个匹配项时立即停止;

    i:表示不区分大小写(case-insensitive)模式,即在确定匹配项时忽略模式与字符串的大小写;

    m:表示多行(multiline)模式,即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项。

       

    模式中使用的所有元字符都必须转义。正则表达式中的元字符包括:

    ( [ { ^ $ | ) ? * + . ] }

       

       

    实例属性:

    global:布尔值,表示是否设置了g标志。

    ignoreCase:布尔值,表示是否设置了i标志。

    lastIndex:整数,表示开始搜索下一个匹配项的字符位置,从0算起。

    multiline:布尔值,表示是否设置了m标志。

    source:返回正则表达式的字符串表示,按照字面量形式而非传入构造函数中的字符串模式返回。

       

    实例方法:

    1.exec()

    该方法是专门为捕获组而设计的,返回数组。

       

    exec()接受一个参数,即要应用模式的字符串,然后返回包含第一个匹配项信息的数组;或者在没有匹配项的情况下返回null

       

    返回的数组虽然是Array的实例,但包含两个额外的属性:indexinput

       

    其中,index表示匹配项在字符串中的位置,而input表示应用正则表达式的字符串。

       

    在数组中,第一项是与整个模式匹配的字符串,其他项是与模式中的捕获组匹配的字符串(如果模式中没有捕获组,则该数组只包含一项)。

       

    var text = "mom and dad and baby";

    var pattern = /mom( and dad( and baby)?)?/gi; //包含捕获组

    var matches = pattern.exec(text);

    alert(matches.index); // 0

    alert(matches.input); // "mom and dad and baby"

    alert(matches[0]); // "mom and dad and baby"

    alert(matches[1]); // " and dad and baby"

    alert(matches[2]); // " and baby"

     

       

    这个例子中的模式包含两个捕获组。最内部的捕获组匹配"and baby",而包含它的捕获组匹配"and

    dad"或者"and dad and baby"。当把字符串传入exec()方法中之后,发现了一个匹配项。因为整个字符串本身与模式匹配,所以返回的数组matchsindex属性值为0。数组中的第一项是匹配的整个字符串,第二项包含与第一个捕获组匹配的内容,第三项包含与第二个捕获组匹配的内容。

       

    对于exec()方法而言,即使在模式中设置了全局标志(g),它每次也只会返回一个匹配项。但每次调用exec()则都会在字符串中继续查找新匹配项

       

    在不设置全局标志的情况下,在同一个字符串上多次调用exec()将始终返回第一个匹配项的信息。

    var text = "cat,bat,sat,fat"; //不包含捕获组,返回一个元素的数组

    var pattern1 = /.at/ig;

    var matches = pattern1.exec(text);

    console.log(pattern1.lastIndex);//3

    var matches = pattern1.exec(text);

    console.log(pattern1.lastIndex);//7

       

    2.test()

    它接受一个字符串参数。在模式与该参数匹配的情况下返回

    true;否则,返回false

       

    RegExp构造函数属性:

    这些属性分别有一个长属性名和一个短属性名(Opera是例外,它不支持短属性名)。

    长属性名

    短属性名

    解释

    input 

    $_

    最近一次要匹配的字符串。Opera未实现此属性

    lastMatch 

    $& 

    最近一次的匹配项。Opera未实现此属性

    lastParent

    $+ 

    最近一次匹配的捕获组。Opera未实现此属性

    leftContext 

    $` 

    input字符串中lastMatch之前的文本

    multiline 

    S* 

    布尔值,表示是否所有表达式都使用多行模式。IEOpera未实现此属性

    rightContext 

    S' 

    Input字符串中lastMatch之后的文本

       

    举例:

    var text = "this has been a short summer";

    var pattern = /(.)hort/g;

    /*

    * 注意:Opera不支持inputlastMatchlastParenmultiline属性

    * Internet Explorer不支持multiline属性

    */

    if (pattern.test(text)){

    alert(RegExp.input); // this has been a short summer

    alert(RegExp.leftContext); // this has been a

    alert(RegExp.rightContext); // summer

    alert(RegExp.lastMatch); // short

    alert(RegExp.lastParen); // s

    alert(RegExp.multiline); // false

    }

       

    如前所述,例子使用的长属性名都可以用相应的短属性名来代替。只不过,由于这些短属性名大都

    不是有效的ECMAScript标识符,因此必须通过方括号语法来访问它们,如下所示。

    var text = "this has been a short summer";

    var pattern = /(.)hort/g;

    /*

    * 注意:Opera不支持inputlastMatchlastParenmultiline属性

    * Internet Explorer不支持multiline属性

    */

    if (pattern.test(text)){

    alert(RegExp.$_); // this has been a short summer

    alert(RegExp["$`"]); // this has been a

    alert(RegExp["$'"]); // summer

    alert(RegExp["$&"]); // short

    alert(RegExp["$+"]); // s

    alert(RegExp["$*"]); // false

    }

    除了上面介绍的几个属性之外,还有多达9个用于存储捕获组的构造函数属性。访问这些属性的语

    法是RegExp.$1RegExp.$2…RegExp.$9,分别用于存储第一、第二……第九个匹配的捕获组。在

    调用exec()test()方法时,这些属性会被自动填充。

    Function类型

    每个函数都是Function类型的实例,而且都与其他引用类型一样具有属性和方法。由于函数是对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定。

       

    格式:

    函数声明:

    function sum (num1, num2) {

    return num1 + num2;

    }

    函数表达式:

    var sum = function(num1, num2){

    return num1 + num2;

    };

       

    使用不带圆括号的函数名是访问函数指针,而非调用函数。

       

    没有重载:

       

    函数声明与函数表达式:

    解析器会率先读取函数声明,并使其在执行任何代码之前可用(可以访问);至于函数表达式,则必须等到解析器执行到它所在的代码行,才会真正被解释执行。

       

    解析器加载时间不一样,声明式的会提前加载,也就是调用可以放在声明之前,而函数表达式不可以,调用必须在表达式函数之后。

       

    作为值得函数:

    函数名本身就是变量,所以函数也可以作为值来使用。也就是说,不仅可以像传递参数一样把一个函数传递给另一个函数,而且可以将一个函数作为另一个函数的结果返回。

       

    以下根据对象属性动态创建对象比较函数:

    function createComparisonFunction(propertyName) {

    return function(object1, object2){

    var value1 = object1[propertyName];

    var value2 = object2[propertyName];

    if (value1 < value2){

    return -1;

    } else if (value1 > value2){

    return 1;

    } else {

    return 0;

    }

    };

    }

       

    函数的内部属性:

    1.arguments

    是一个类数组对象,包含着传入函数中的所有参数。虽然arguments的主要用途是保存函数参数,但这个对象还有一个名叫callee的属性,该属性是一个指针,指向拥有这个arguments对象的函数

    function factorial(num){

    if (num <=1) {

    return 1;

    } else {

    return num * arguments.callee(num-1)

    }

    }

       

    2.this

    引用的是函数据以执行的环境对象。

       

    window.color = "red";

    var o = { color: "blue" };

    function sayColor(){

    alert(this.color);

    }

    sayColor(); //"red"

    o.sayColor = sayColor;

    o.sayColor(); //"blue"

       

    3.caller

    这个属性中保存着调用当前函数的函数的引用,如果是在全局作用域中调用当前函数,它的值为null

       

    函数属性和方法:

    每个函数都包含两个属性:lengthprototype

       

    1.length属性

    它表示函数希望接收的命名参数的个数。

       

    2.prototype

    是保存它们所有实例方法的真正所在。换句话说,诸如toString()valueOf()等方法实际上都保存在prototype名下,只不过是通过各自对象的实例访问罢了。

    3.apply()

    apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组。其中,第二个参数可以是Array的实例,也可以是

    arguments对象。

       

    function sum(num1, num2){

    return num1 + num2;

    }

    function callSum1(num1, num2){

    return sum.apply(this, arguments); // 传入arguments对象

    }

    function callSum2(num1, num2){

    return sum.apply(this, [num1, num2]); // 传入数组

    }

    alert(callSum1(10,10)); //20

    alert(callSum2(10,10)); //20

       

    4.call()

    与apply()功能一样,第一个参数是运行函数的作用域。但传递给函数的参数必须逐个列举出来。

       

    function sum(num1, num2){

    return num1 + num2;

    }

    function callSum(num1, num2){

    return sum.call(this, num1, num2);

    }

    alert(callSum(10,10)); //20

       

    传递参数并非apply()call()真正的用武之地;它们真正强大的地方是能够扩充函数赖以运行的作用域。下面来看一个例子。

    window.color = "red";

    var o = { color: "blue" };

    function sayColor(){

    alert(this.color);

    }

    sayColor(); //red

    sayColor.call(this); //red

    sayColor.call(window); //red

    sayColor.call(o); //blue

     

    基本包装类型

    ECMAScript还提供了3个特殊的引用类型:BooleanNumber String。这些类型与本章介绍的其他引用类型相似,但同时也具有与各自的基本类型相应的特殊行为。

       

    每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而让我们能够调用一些方法来操作这些数据。

       

    引用类型与基本包装类型的主要区别就是对象的生存期。

       

    使用new操作符创建的引用类型的实例,在执行流离开当前作用域之前都一直保存在内存中。

    而自动创建的基本包装类型的对象,则只存在于一行代码的执行瞬间,然后立即被销毁。这意味着我们不能在运行时为基本类型值添加属性和方法。

       

    Boolean类型

    Boolean类型是与布尔值对应的引用类型。要创建Boolean对象,可以像下面这样调用Boolean构造函数并传入truefalse值。

    var booleanObject = new Boolean(true);

       

    Boolean类型的实例重写了valueOf()方法,返回基本类型值truefalse;重写了toString()方法,返回字符串"true""false"

       

    注:

    基本类型与引用类型的布尔值还有两个区别。首先,typeof操作符对基本类型返回"boolean"

    而对引用类型返回"object"。其次,由于Boolean对象是Boolean类型的实例,所以使用instanceof

    操作符测试Boolean对象会返回true,而测试基本类型的布尔值则返回false

       

       

    Number类型

    Number是与数字值对应的引用类型。要创建Number对象,可以在调用Number构造函数时向其中传递相应的数值。下面是一个例子。

    var numberObject = new Number(10);

       

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

    数值。可以为toString()方法传递一个表示基数的参数,告诉它返回几进制数值的字符串形式。

       

    Number类型还提供了一些用于将数值格式化为字符串的方法。

       

    toFixed()

    方法会按照指定的小数位返回数值的字符串表示

    例如:

    var num = 10;

    alert(num.toFixed(2)); //"10.00"

       

    toExponential()

    该方法返回以指数表示法(也称e表示法)表示的数值的字符串形式。与toFixed()一样,toExponential()也接收一个参数,而且该参数同样也是指定输出结果中的小数位数。

       

    var num = 10;

    alert(num.toExponential(1)); //"1.0e+1"

       

       

    注:

    在使用typeof操作符测试基本类型数值时,始终会返回"number",而在测试Number对象时,则会返回"object"。类似地,Number对象是Number类型的实例,而基本类型的数值则不是。

       

    String类型

    String对象的方法也可以在所有基本的字符串值中访问到。其中,继承的valueOf()toLocaleString()toString()方法,都返回对象所表示的基本字符串值。

       

    length属性:

    返回字符串长度。

       

    字符方法:

    1.charAt()

    返回给定位置的字符。

       

    2.charCodeAt()

    返回给定位置的字符的编码。

       

    字符串操作方法:

    1.concat()

    用于将一或多个字符串拼接起来,

    返回拼接得到的新字符串

       

    var stringValue = "hello ";

    var result = stringValue.concat("world");

    alert(result); //"hello world"

    alert(stringValue); //"hello"

       

    不改变原有字符串

    2.slice()、substr()、substring()

    返回被操作字符串的一个子字符串,接受一或两个参数。

    第一个参数指定子字符串的开始位置。

    slice()和substring()第二个参数(在指定的情况下)表示子字符串到哪里结束。

    substr()第二个参数指定返回字符串的个数。

       

    不改变原有字符串

       

    字符串位置方法:

    indexOf()lastIndexOf()

    这两个方法都是从一个字符串中搜索给定的子字符串,然后返子字符串的位置(如果没有找到该子字符串,则返回-1)。

       

    这两个方法的区别在于:indexOf()方法从字符串的开头向后搜索子字符串,而lastIndexOf()方法

    是从字符串的末尾向前搜索子字符串。

       

    trim()方法:

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

       

    原始字符串中的前置及后缀空格会保持不变

    大小写转换:

    toLowerCase()toLocaleLowerCase()toUpperCase()toLocaleUpperCase()

       

    字符串的模式匹配:

    String类型定义了几个用于在字符串中匹配模式的方法。

       

    1.match()

    在字符串上调用这个方法,本质上与调用RegExpexec()方法相同。match()方法只接受一个参数,要么是一个正则表达式,要么是一个RegExp对象。

       

    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

    2.search()

    search()方法返回字符串中第一个匹配项的索引;如果没有找到匹配项,则返回-1。而且,search()方法始终是从字符串开头向后查找模式。

       

    var text = "cat, bat, sat, fat";

    var pos = text.search(/at/);

    alert(pos); //1

       

    3.replace()

    这个方法接受两个参数:第一个参数可以是一个RegExp对象或者一个字符串(这个字符串不会被转换成正则表达式),第二个参数可以是一个字符串或者一个函数。如果第一个参数是字符串,那么只会替换第一个子字符串。要想替换所有子字符串,唯一的办法就是提供一个正则表达式,而且要指定全局(g)标志,如下所示:

       

    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"

       

    如果第二个参数是字符串,还可以使用一些特殊字符:

       

       

    var text = "cat, bat, sat, fat";

    result = text.replace(/(.at)/g, "word ($1)");

    alert(result); //word (cat), word (bat), word (sat), word (fat)

       

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

    这个函数应该返回一个字符串,表示应该被替换的匹配项使用函数作为replace()方法的第二个参数。可以实现更加精细的替换操作。

    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;

       

    4.split()

    这个方法可以基于指定的分隔符将一个字符串分割成多个子字符串,并将结果放在一个数组中。分隔符可以是字符串,也可以是一个RegExp对象(这个方法不会将字符串看成正则表达式)。split()方法可以接受可选的第二个参数,用于指定数组的大小,

    以便确保返回的数组不会超过既定大小。

       

    var colorText = "red,blue,green,yellow";

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

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

    var colors3 = colorText.split(/[^\,]+/); //["", ",", ",", ",", ""]

       

    localeCompare()方法:

    这个方法比较两个字符串,并返回下列值中的一个:

    如果字符串在字母表中应该排在字符串参数之前,则返回一个负数(大多数情况下是-1,具体

    的值要视实现而定);

    如果字符串等于字符串参数,则返回0

    如果字符串在字母表中应该排在字符串参数之后,则返回一个正数(大多数情况下是1,具体的值同样要视实现而定)。

    var stringValue = "yellow";

    alert(stringValue.localeCompare("brick")); //1

    alert(stringValue.localeCompare("yellow")); //0

    alert(stringValue.localeCompare("zoo")); //-1

       

    fromCharCode()方法:

    这个方法的任务是接收一或多个字符编码,然后将它们转换成一个字符串。从本质上来看,这个方法与实例方法charCodeAt()执行的是相反的操作。

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

       

    HTML方法:

    省略

       

    单体内置对象

    Global对象:

    Global(全局)对象可以说是ECMAScript中最特别的一个对象了,因为不管你从什么角度上看,这个对象都是不存在的。ECMAScript中的Global对象在某种意义上是作为一个终极的"兜底儿对象"来定义的。换句话说,不属于任何其他对象的属性和方法,最终都是它的属性和方法。事实上,没有全局变量或全局函数;所有在全局作用域中定义的属性和函数,都是Global对象的属性。本书前面介绍过的那些函数,如isNaN()isFinite()parseInt()以及parseFloat(),实际上全都是Global对象的方法。除此之外,Global对象还包含其他一些方法。

       

    1.URI编码方法

       

    Global 对象的encodeURI()encodeURIComponent()方法可以对URI进行编码,以便发送给浏览器。有效的URI中不能包含某些字符,例如空格。而这两个URI编码方法就可以对URI进行编码,它们用特殊的UTF-8编码替换所有无效的字符,从而让浏览器能够接受和理解。

    其中,encodeURI()主要用于整个URI(例如,http://www.wrox.com/illegal value.htm)。

    encode- URIComponent()主要用于对URI中的某一段(例如前面URI中的illegal value.htm)进行编码。

    它们的主要区别在于,encodeURI()不会对本身属于URI的特殊字符进行编码,例如冒号、正斜杠、

    问号和井字号;而encodeURIComponent()则会对它发现的任何非标准字符进行编码。

       

    var uri = "http://www.wrox.com/illegal value.htm#start";

       

    //"http://www.wrox.com/illegal%20value.htm#start"

    alert(encodeURI(uri));

       

    //"http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start"

    alert(encodeURIComponent(uri));

       

    注:

    一般来说,我们使用encodeURIComponent()方法的时候要比使用

    encodeURI()更多,因为在实践中更常见的是对查询字符串参数而不是对基础URI进行编码。

       

    encodeURI()encodeURIComponent()方法对应的两个方法分别是decodeURI()decodeURIComponent()。其中,decodeURI()只能对使用encodeURI()替换的字符进行解码。例如,它可将%20替换成一个空格,但不会对%23作任何处理,因为%23表示井字号(#),而井字号不是使用encodeURI()替换的。同样地,decodeURIComponent()能够解码使用encodeURIComponent()编码的所有字符,即它可以解码任何特殊字符的编码。来看下面的例子:

    var uri = "http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start";

       

    //http%3A%2F%2Fwww.wrox.com%2Fillegal value.htm%23start

    alert(decodeURI(uri));

       

    //http://www.wrox.com/illegal value.htm#start

    alert(decodeURIComponent(uri));

       

       

       

    eval()方法:

    eval("alert('hi')");

    这行代码的作用等价于下面这行代码:

    alert("hi");

    当解析器发现代码中调用eval()方法时,它会将传入的参数当作实际的ECMAScript语句来解析,

    然后把执行结果插入到原位置。通过eval()执行的代码被认为是包含该次调用的执行环境的一部分,

    因此被执行的代码具有与该执行环境相同的作用域链。这意味着通过eval()执行的代码可以引用在包

    含环境中定义的变量,举个例子:

    var msg = "hello world";

    eval("alert(msg)"); //"hello world"

       

    eval()中创建的任何变量或函数都不会被提升,因为在解析代码的时候,它们被包含在一个字符串中;它们只在eval()执行的时候创建。

       

    Global对象的属性:

       

       

       

    window对象:

    ECMAScript虽然没有指出如何直接访问Global对象,但Web浏览器都是将这个全局对象作为window对象的一部分加以实现的。因此,在全局作用域中声明的所有变量和函数,就都成为了window对象的属性。

    var color = "red";

    function sayColor(){

    alert(window.color);

    }

    window.sayColor(); //"red"

       

       

    Math对象:

    1.Math对象的属性

       

       

    2.min()和max()方法

    min()max()方法用于确定一组数值中的最小值和最大值。这两个方法都可以接收任意多个数值参数。

    var max = Math.max(3, 54, 32, 16);

    alert(max); //54

    var min = Math.min(3, 54, 32, 16);

    alert(min); //3

       

    要找到数组中的最大或最小值,可以像下面这样使用apply()方法。

    var values = [1, 2, 3, 4, 5, 6, 7, 8];

    var max = Math.max.apply(Math, values);

    这个技巧的关键是把Math对象作为apply()的第一个参数,从而正确地设置this值。然后,可以将任何数组作为第二个参数

       

    3.舍入方法

    Math.ceil()执行向上舍入,即它总是将数值向上舍入为最接近的整数;

    Math.floor()执行向下舍入,即它总是将数值向下舍入为最接近的整数;

    Math.round()执行标准舍入,即它总是将数值四舍五入为最接近的整数

       

    4.random()方法

    Math.random()方法返回大于等于0小于1的一个随机数。

       

    5.其他方法

       

  • 相关阅读:
    笔记二
    笔记一:高效的可维护的,组件化的CSS
    移动端调自适应的方法
    前端世界的憧憬
    JAVA继承、多态与接口
    JAVA第一周
    常用CSS标签1——属性
    回头再看N层架构(图解)
    .net 配置加密
    小小商城的一次前端架构演变
  • 原文地址:https://www.cnblogs.com/wuchaodzxx/p/5519278.html
Copyright © 2011-2022 走看看