JavaScript高级程序设计笔记02 | 第五章 | 引用类型 | 日期 /时间组件方法

这篇博客详细介绍了JavaScript中的引用类型,包括Object、Array、Date和RegExp。重点讲解了Array的创建、操作方法如push、pop、shift、unshift、slice、splice等,以及Date类型的创建、获取时间组件的方法。此外,还提到了正则表达式和字符串的相关操作。
摘要由CSDN通过智能技术生成

观前提示:大部分都是书上的内容,个人理解的部分的较少,看我的笔记还不如去看书

第五章

引用类型是一种数据结构, 用于将数据和功能组织在一起。

一、Object 类型

创建:

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

person.name = “Nicholas”;

person.age = 29;

或者

var person = {

​ name : “Nicholas”, //name可以加双引号"name"

​ age : 29

};

访问时可以用以下两种方式:

alert(person[“name”]); //这种方式可以包含非字母非数字,也可以通过变量来访问属性

alert(person.name); //除非必须使用变量来访问属性,否则使用点表示法

二、Array 类型

创建:

使用 Array 构造函数

var colors = new Array(20); // 创建一个包含 20 项的数组

var names = new Array(“red”, “blue”, “green”); // 创建一个包含 3 项

或字面量表示法

var colors = [“red”, “blue”, “green”]; // 创建一个包含 3 个字符串的数组,最后不要加逗号

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

读取和设置数组:

var colors = [“red”, “blue”, “green”]; // 定义一个字符串数组

alert(colors[0]); // 显示第一项

colors[2] = “black”; // 修改第三项

colors[3] = “brown”; // 新增第四项

数组长度:

alert(colors.length); //3

colors.length = 4; //可以修改数组的长度,新增了一个数但未赋值

alert(colors[3]); //undefined,此时colors.length为4

colors[colors.length] = “brown”; //(在位置 4)再添加一种颜色

colors[99] = “black”; // (在位置 99)添加一种颜色

alert(colors.length); // 100 ,即99+1

确定是不是数组:

方法一:

if (value instanceof Array){

​ //对数组执行某些操作

}

但它假定只有一个全局执行环境,所以如果包含多个框架,那就有两个以上的全局执行环境,从而存在两个以上不同版本的 Array 构造函数。

方法二:

if (Array.isArray(value)){

​ //对数组执行某些操作

}

这个方法的目的是终确定某 个值到底是不是数组,而不管它是在哪个全局执行环境中创建的。需要浏览器为IE9+、Firefox 4+、Safari 5+、Opera 10.5+和 Chrome。

转换方法:

1、toLocaleString():

经常也会返回与 toString()和 valueOf()方法相同的值,但本质上依旧是两种不同的方法

2、toString():

返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串

3、valueOf():

返回的还是数组

4、join():

返回包含所有数组项的字符串,参数为分隔符;如果不给 join()方法传入任何值,或者给它传入 undefined,则使用逗号作为分隔符

var colors = [“red”, “green”, “blue”];

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

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

栈方法:

新添加的项早被移除;

push()方法:

接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度

pop()方法:

从数组末尾移除后一项,减少数组的 length 值,然后返回移除的项

队列方法:

shift()方法:

移除数组中的第一个项并返回该项,同时将数组长度减 1

队列在列表的末端添加项,从列表的前端移除项;使用 shift()和 push()方法,可以像使 用队列一样使用数组

unshift()方法:

与 shift()的用途相反,它能在数组前端添加任意个项并返回新数组的长度

同时使用 unshift()和 pop()方法,可以 从相反的方向来模拟队列,即在数组的前端添加项,从数组末端移除项

重排序方法:

reverse()和 sort()。其中reverse()方法会反转数组项的顺序。

但sort()方法会调用每个数组项的 toString()转型方法,然后比较得到的字符串,所以即使数组中的每一项都是数值,sort()方法比较的也是字符串,所以会出现以下问题:

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

values.sort();

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

所以,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 

对于数值类型或者其 valueOf()方法会返回数值类型的对象类型,可以使用更简单的函数

function compare(value1, value2){

​ return value2 - value1;

}

操作方法:

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()方法返回从该参数指定位置开始到当前数组末尾的所有项;如果有两个参数,该方法返回起始和结束位置之间的项— —但不包括结束位置的项

有点晕,上例子:

var colors = [“red”, “green”, “blue”, “yellow”, “purple”];

var colors2 = colors.slice(1);

var colors3 = colors.slice(1,4);

alert(colors2); //green,blue,yellow,purple 返回1到末尾的所有项

alert(colors3); //green,blue,yellow 返回1到3的项,不包含4

注:

如果 slice()方法的参数中有一个负数,则用数组长度加上该数来确定相应的位置。

例如,在一个包含5项的数组上调用 slice(-2,-1)与调用 slice(3,4)得到的结果相同。

如果结束位置小于起始位置,则返回空数组。

3、splice()方法

该方法始终都会返回一个数组,根据参数可以实现删除,插入和替换的功能:

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

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

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

上例子:

var colors = ["red", "green", "blue"]; 
var removed = colors.splice(0,1);      // 从第0项开始,删除一个数,即删除一个项 
alert(colors);     // green,blue 
alert(removed);    // red,删除的项

removed = colors.splice(1, 0, "yellow", "orange");   // 从位置1开始,删除0个数,并插入两项,即插入两项
alert(colors);     // green,yellow,orange,blue 
alert(removed);    // 没有删除,所以返回空数组

removed = colors.splice(1, 1, "red", "purple");      // 从位置1开始,删除1个数,并插入两项,即插入两项,删除一项 
alert(colors);     // green,red,purple,orange,blue 
alert(removed);    // yellow,删除了一项,所以返回的数组中只包含一项

4、位置方法

indexOf()和 lastIndexOf():

都接收两个参数:要查找的项和(可选的)表示查找起点位置的索引

其中,indexOf()方法从数组的开头(位置0)开始向后查找;

lastIndexOf()方法则从数组的末尾开始向前查找

返回要查找的项在数组中的位置,或者在没找到的情况下返回-1

5、迭代方法

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

 forEach():对数组中的每一项运行给定函数。这个方法没有返回值。本质上与使用 for 循环迭代数组一样

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

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

接收两个参数:要在每一项上运行的函数和 (可选的)运行该函数的作用域对象——影响 this 的值

传入这些方法中的函数会接收三个参数:数 组项的值、该项在数组中的位置和数组对象本身

例如:

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

var everyResult = numbers.every(function(item, index, array){

​ return (item > 2);

});

alert(everyResult); //false

6、归并方法

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类型

创建

var now = new Date();

不传递参数的情况下,新创建的对象自动获得当前日期和时间;

但如果想根 据特定的日期和时间创建日期对象,必须传入表示该日期的毫秒数(即从 UTC时间 1970年 1月 1日午 夜起至该日期止经过的毫秒数)

为简化计算,提供了两个方法:

1、Date.parse()方法

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

 “月/日/年”,如 6/13/2004;

 “英文月名 日,年”,如 January 12,2004;

 “英文星期几 英文月名 日 年 时:分:秒 时区”,如 Tue May 25 2004 00:00:00 GMT-0700。

 ISO 8601 扩展格式 YYYY-MM-DDTHH:mm:ss.sssZ(例如 2004-05-25T00:00:00)。只有兼容 ECMAScript 5的实现支持这种格式。

例如,要为 2004年 5月 25日创建一个日期对象,可以使用下面的代码:

var someDate = new Date(Date.parse(“May 25, 2004”));

这个代码与下面这个代码等价:

var someDate = new Date(“May 25, 2004”);

注:

如果传入 Date.parse()方法的字符串不能表示日期,那么它会返回 NaN

2、Date.UTC()方法

返回表示日期的毫秒数

Date.UTC()的参数分别是年份、基于0的月份(一月是 0,二月是 1,以此类推)、月中的哪一天(1到31)、小时数(0到23)、分钟、秒以及毫秒数。

在这些参数中,只有前两个参数(年和月)是必需的,没有设置其他参数的话,默认为0

如:

var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55));

也可以写为:

var allFives = new Date(2005, 4, 5, 17, 55, 55);

测函数运行时间:

在支持 Data.now()方法的浏览器IE9+、Firefox 3+、Safari 3+、Opera 10.5和 Chrome中:

var start = Date.now(); //取得开始时间

doSomething(); //调用函数

var stop = Date.now(),

​ result = stop – start; //取得停止时间

如果不支持 Data.now()方法,可以将Data转换为字符串:

var start = +new Date(); //取得开始时间

doSomething(); //调用函数

var stop = +new Date(),

​ result = stop - start; //取得停止时间

日期格式化方法:

将日期格式化为字符串

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

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

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

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

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

日期 /时间组件方法:

以下为常用的,其余放在文末:

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

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

getDate() 返回日期月份中的天数(1到31)

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

getHours() 返回日期中的小时数(0到23)

getMinutes() 返回日期中的分钟数(0到59)

getSeconds() 返回日期中的秒数(0到59)

会利用这些来自己编写想要的日期格式。

四、RegExp 类型

ECMAScript通过 RegExp 类型来支持正则表达式

var expression = / pattern / flags ;

pattern 为正则表达式,flags 为标志,表明正则表达式的行为

flags:

 g:表示全局(global)模式,即模式将被应用于所有字符串,而非在发现第一个匹配项时立即停止;意思是寻找所有符合标准的项

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

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

与其他语言中的正则表达式类似,模式中使用的所有元字符都必须转义。正则表达式中的元字符包括:

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

构造:

var pattern1 = /\w\hello\123/i;

var pattern2 = new RegExp("\w\\hello\\123", “i”); //与 pattern1 相同,只不过是使用构造函数创建的,所有元字符都必须双重转义

实例属性:

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

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

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

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

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

用处不大,因为都包含在模式声明中,但实例方法中会用到部分概念

实例方法:

1、exec():

返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。

包含两个额外的属性:index 和 input。其中,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"

当被测的字符串(pattern2)是一个全局正则表达式时(含有g),exec() 的行为就稍微复杂一些。它会在 pattern2的 lastIndex 属性指定的字符处开始检索字符串 string。当 exec() 找到了与表达式相匹配的文本时,在匹配后,它将把 pattern2的 lastIndex 属性设置为匹配文本的最后一个字符的下一个位置。

这就是说,你可以通过反复调用 exec() 方法来遍历字符串中的所有匹配文本。当 exec() 再也找不到匹配的文本时,它将返回 null,并把 lastIndex 属性重置为 0。

var text = “cat, bat, sat, fat”;

var pattern2 = /.at/g;

var matches = pattern2.exec(text);

alert(matches.index); //0

alert(matches[0]); //cat

alert(pattern2.lastIndex); //3

matches = pattern2.exec(text);

alert(matches.index); //5

alert(matches[0]); //bat

alert(pattern2.lastIndex); //8

2、test():

在模式与该参数匹配的情况下返回 true;否则,返回 false

通常在if语句中使用

**RegExp构造函数属性: **

使用这些属性可以从 exec()或 test()执行的操作中提取出更具体的信息
在这里插入图片描述

看不懂没关系,上例子:

var text = “this has been a short summer”;

var pattern = /(.)hort/g;

//注意:Opera 不支持 input、lastMatch、lastParen 和 multiline 属性, Internet Explorer 不支持 multiline 属性

if (pattern.test(text)){

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

​ alert(RegExp.lastMatch); // short

​ alert(RegExp.lastParen); // s

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

​ alert(RegExp.multiline); // false

​ alert(RegExp.rightContext); // summer

}

所以这些函数的返回值:

 input 属性返回了原始字符串;

 leftContext 属性返回了单词 short 之前的字符串,而 rightContext 属性则返回了 short 之后的字符串;

 lastMatch 属性返回近一次与整个正则表达式匹配的字符串,即 short;

 lastParen 属性返回近一次匹配的捕获组,即例子中的 s。

如果要使用段属性名访问,如:

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

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

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

由于这些短属性名大都不是有效的 ECMAScript标识符,因此必须通过方括号语法来访问

局限性:

ECMAScript正则表达式不支持的特性:

 匹配字符串开始和结尾的\A 和\Z 锚,但支持以插入符号(^)和美元符号($)来匹配字符串的开始和结尾

 向后查找(lookbehind),但完全支持向前查找(lookahead)

 并集和交集类

 原子组(atomic grouping)  Unicode支持(单个字符除外,如\uFFFF)

 命名的捕获组,但支持编号的捕获组

 s(single,单行)和 x(free-spacing,无间隔)匹配模式

 条件匹配

 正则表达式注释

五、Function 类型

构造:

function sum (num1, num2) {

return num1 + num2;

}

这与下面使用函数表达式定义函数的方式几乎相差无几

var sum = function(num1, num2){

​ return num1 + num2;

};

注意末尾的分号;

还有一种方法,但是不推荐;

var sum = new Function(“num1”, “num2”, “return num1 + num2”);

函数名仅仅是指向函数的指针,因此一个函数可能会有多个名字

没有重载:

将函数名想象为指针,每次重新书写的时候,都会覆盖前一次的函数,所以没有重载

**函数声明与函数表达式: **

JavaScript 引擎会自动进行函数声明提升,所以当你使用函数声明时,可以不需要考虑他的先后顺序;

但把函数声明改为等价的函数表达式时,必须先声明再使用

作为值的函数

因为 ECMAScript中的函数名本身就是变量,所以函数也可以作为值来使用。

也就是说,不仅可以像传递参数一样把一个函数传递给另一个函数,而且可以将一个函数作为另一个函数的结果返回;

也可以在一个函数内嵌套另一个函数

函数内部属性

1、arguments

arguments 是一个类数组对象,包含着传入函数中的所有参数;

他还有一个名叫 callee 的属性,该属性是一个指针,指向拥有这个 arguments 对象的函数。

function factorial(num){

​ if (num <=1) {

​ return 1;

​ } else {

​ return num * arguments.callee(num-1) //callee指的是拥有arguments的函数,即factorial(),这样,就算改变factorial的名字,也不会对函数造成影响

​ }

}

2、this

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

ECMAScript 5也规范化了另一个函数对象的属性:caller中保存着调用当前函数的函数的引用, 如果是在全局作用域中调用当前函数,它的值为 null。

函数属性和方法

1、length 与 prototype

length 属性表示函数希望接收的命名参数的个数

2、apply 与 call

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

call()方法与 apply()方法的作用相同,它们的区别仅在于接收参数的方式不同。对于 call()方法而言,第一个参数是 this 值没有变化,变化的是其余参数都直接传递给函数;换句话说,在使用 call()方法时,传递给函数的参数必须逐个列举出来

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

3、bind

ECMAScript 5还定义了一个方法:bind()。这个方法会创建一个函数的实例,其 this 值会被绑定到传给 bind()函数的值

window.color = “red”;

var o = { color: “blue” };

function sayColor(){

​ alert(this.color);

}

var objectSayColor = sayColor.bind(o); //objectSayColor 的this值为o

objectSayColor(); //blue

六、基本包装类型

Boolean类型

理解基本类型的布尔值与 Boolean 对象之间的区别非常重要——当然,我们的建议是永远不要使用 Boolean 对象。

Number类型

var numberObject = new Number(10);

Number 类型也重写了 valueOf()、toLocaleString()和 toString() 方法。

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

toFixed()方法:

会按照指定的小数位返回数值的字符串表示,如果数值本身包含的小数位比指定的还多,那么接近指定的大小数位的值就会舍入

var num = 10;

alert(num.toFixed(2)); //“10.00”

toExponential()方法:

法返回以指数表示法(也称 e表示法) 表示的数值的字符串形式,接收一个参数,该参数指定输出结果中的小数位数

var num = 10;

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

toPrecision()方法:

可能会返回固定大小(fixed)格式,也可能返回指数 (exponential)格式;接收一个参数,即表示数值的所有数字的 位数(不包括指数部分)

var num = 99;

alert(num.toPrecision(1)); //“1e+2”

alert(num.toPrecision(2)); //“99”

alert(num.toPrecision(3)); //“99.0”

不建议直接实例化 Number 类型

String类型

var stringObject = new String(“hello world”);

String 类型的每个实例都有一个 length 属性,表示字符串中包含多个字符

var stringValue = “hello world”;

alert(stringValue.length); //“11”

即使字符串中包含双字节字符(不是占一个字节的 ASCII字符),每个字符也仍然算一个字符

1、字符方法

charAt()方法以单字符字符串的形式返回给定位置的那个字符

而charCodeAt()得到的不是字符而是字符编码

还有另外一种:

var stringValue = “hello world”;

alert(stringValue[1]); //“e”

但这个方法在 IE7 及更早版本中使用这种语法,会返回 undefined 值

2、字符串操作方法

concat():

用于将一或多个字符串拼接起来, 返回拼接得到的新字符串

var stringValue = "hello ";

var result = stringValue.concat("world, “!”);

alert(result); //“hello world!”

alert(stringValue); //“hello”

在实践中,使用更多的还是加号操作符(+)

还有:slice()、substr()和substring()三种方法:

var stringValue = “hello world”;

alert(stringValue.slice(3)); //“lo world”

alert(stringValue.substring(3)); //“lo world”

alert(stringValue.substr(3)); //“lo world”

alert(stringValue.slice(3, 7)); //“lo w”

alert(stringValue.substring(3,7)); //“lo w”

alert(stringValue.substr(3, 7)); //“lo worl”

slice()和 substring()的第二个参数指定的是子字符串后一个字符后面的位置。

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

如果没有给这些方法传递第二个参数,则将字符串的长度作为结束位置

var stringValue = “hello world”;

alert(stringValue.slice(-3)); //“rld”

alert(stringValue.substring(-3)); //“hello world”

alert(stringValue.substr(-3)); //“rld”

alert(stringValue.slice(3, -4)); //“lo w”

alert(stringValue.substring(3, -4)); //“hel”

alert(stringValue.substr(3, -4)); //""(空字符串)

在给 slice()和 substr()传递一个负值参数时,它们的行为相同。

这是因为-3会被转换为 8(字符串长度加参数 11+(-3)=8),实际上相当 于调用了 slice(8)和 substr(8)。

但 substring()方法则返回了全部字符串,因为它将-3 转换 成了 0

当第二个参数是负值时:

slice()方法会把第二个参数转换为 7,这 就相当于调用了 slice(3,7),因此返回"lo w"。

substring()方法会把第二个参数转换为 0,使调 用变成了 substring(3,0),而由于这个方法会将较小的数作为开始位置,将较大的数作为结束位置, 因此终相当于调用了 substring(0,3)。

substr()也会将第二个参数转换为 0,这也就意味着返回 包含零个字符的字符串,也就是一个空字符串

3、字符串位置方法

indexOf()和 lastIndexOf():

都是搜索字符串,返回子字符串的位置(如果没有找到该子字符串,则返回-1)

var stringValue = “hello world”;

alert(stringValue.indexOf(“o”, 6)); //7 从前往后,第6位开始向后搜索

alert(stringValue.lastIndexOf(“o”, 6)); //4 从后往前,第4位往前搜索

4、trim()方法

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

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

toLowerCase()、toLocaleLowerCase()、toUpperCase()和 toLocaleUpperCase()

toLocaleLowerCase()和 toLocaleUpperCase()方法则是针对特定地区的实现,在不知道自己的代码将在哪种语言环境中运行的情况下,还是使用针对地区的方法更稳妥一些

6、字符串的模式匹配方法

match():

本质上与调用 RegExp 的 exec()方法相同。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

search()方法:

唯一参数与 match()方法的参数相同:由字符串或 RegExp 对象指定的一个正则表达式。

search()方法返回字符串中第一个匹配项的索引;如果没有找到匹配项,则返回-1。

而且,search()方法始终是从字符串开头向后查找模式。

var text = “cat, bat, sat, fat”;

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

alert(pos); //1

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)

replace()方法的第二个参数也可以是一个函数;函数返回值为字符串;

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(/[^\,]+/);     //["", ",", ",", ",", ""]

7、localeCompare()方法

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

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

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

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

上例子:

var stringValue = “yellow”;

alert(stringValue.localeCompare(“brick”)); //1

alert(stringValue.localeCompare(“yellow”)); //0

alert(stringValue.localeCompare(“zoo”)); //-1

其实就是根据字母表的顺序排序

8、fromCharCode()方法

是接收一或 多个字符编码,然后将它们转换成一个字符串

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

9、HTML方法
在这里插入图片描述

应该尽量不使用这些方法,因为它们创建的标记通常无法表达语义

七、单体内置对象

内置对象:“由 ECMAScript实现提供的、不依赖于宿主环境的对象,这些对 象在 ECMAScript程序执行之前就已经存在了“,意思是开发人员不必显式地实例化内置对象,因为它们已经实例化了。

前面我们已经介绍了大多数内置对象,例如 Object、Array 和 String。 ECMA-262还定义了两个单体内置对象:Global 和 Math。

1、Global对象

不属于任何其他对象的属性和方法,终都是它的属性和方法,如 isNaN()、isFinite()、parseInt()以及 parseFloat(),实际上全都是 Global 对象的方法

除此之外,还包含了一些其他的方法:

1、URI编码方法

二者可以对 URI(Uniform Resource Identifiers,通用资源标识符)进行编码,以便发送给浏览器

encodeURI()方法:

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

不会对本身属于 URI 的特殊字符进行编码,例如冒号、正斜杠、 问号和井字号;

encodeURIComponent()方法:

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

会对它发现的任何非标准字符进行编码。

上例子:

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));

与 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));

2、eval()方法

eval() 方法就像是一个完整的 ECMAScript解析器,它只接受一个参数,即要执行的 ECMAScript(或 JavaScript) 字符串

在 eval()中创建的任何变量或函数都不会被提升

3、Global 对象的属性

Global 对象的所有属性:
在这里插入图片描述

4、window 对象

在全局作用域中声明的所有变量和函数,就都成为了 window 对象的属性

2、Math对象

为保存数学公式和信息提供了一个公共位置

1、Math 对象的属性
在这里插入图片描述
2、min()和 max()方法

用于确定一组数值中的小值和大值

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

alert(max); //54

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

alert(min); //3

找数组的最大最小值:

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

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

3、舍入方法

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

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

 Math.round()执行标准舍入,即它总是将数值四舍五入为接近的整数(这也是我们在数学课上学到的舍入规则)。

4、random()方法

返回大于等于 0小于 1的一个随机数

套用以下公式,可以以利用 Math.random() 从某个整数范围内随机选择一个值

**值 = Math.floor(Math.random() * 可能值的总数 + 第一个可能的值) **

selectFrom():

接受两个参数:应该返回的小值和大值

利用这个函数,可以方便地从数组中随机取出一项

var colors = [“red”, “green”, “blue”, “yellow”, “black”, “purple”, “brown”];

var color = colors[selectFrom(0, colors.length-1)];

alert(color); // 可能是数组中包含的任何一个字符串

5、其他方法

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-qHQrNZcx-1595039619151)(C:\Users\lshan\AppData\Roaming\Typora\typora-user-images\image-20200718103158297.png)]

关于时间的:

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() 返回日期月份中的天数(1到31)

getUTCDate() 返回UTC日期月份中的天数(1到31)

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

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

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

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

getHours() 返回日期中的小时数(0到23)

getUTCHours() 返回UTC日期中的小时数(0到23)

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

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

getMinutes() 返回日期中的分钟数(0到59)

getUTCMinutes() 返回UTC日期中的分钟数(0到59)

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

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

getSeconds() 返回日期中的秒数(0到59)

getUTCSeconds() 返回UTC日期中的秒数(0到59)

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

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

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

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

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

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

getTimezoneOffset() 返回本地时间与UTC时间相差的分钟数。例如,美国东部标准时间返回300。在某地进入夏令时的情况下,这个值会有所变化

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值