JavaScript对象

对象

对象概述

JavaScript是面向对象编程(OOP)语言。 如果编程语言为开发人员提供了四种基本功能,则可以将其称为面向对象 −

  • 封装 − 将相关信息(无论是数据还是方法)存储在对象中的能力。
  • 聚合 − 将一个对象存储在另一个对象中的能力。
  • 继承 − 类的一些属性和方法依赖于另一个类(或类的数量)的能力。
  • 多态性 − 能够编写一种以各种不同方式工作的函数或方法。

对象由属性组成。 如果属性包含函数,则将其视为对象的方法,否则将该属性视为属性。

对象属性

对象属性可以是三种基本数据类型中的任何一种,也可以是任何抽象数据类型,例如另一个对象。 对象属性通常是在对象方法内部使用的变量,但也可以是在整个页面中使用的全局可见变量。

向对象添加属性的语法是 −

objectName.objectProperty = propertyValue;

例如 - 以下代码使用文档对象的“title”属性获取文档标题。

var str = document.title;

对象方法

方法是让对象做某事或让某事做完的功能。 函数和方法之间存在细微差别 - 函数是一个独立的语句单元,一个方法附加到一个对象,可以通过this关键字引用。

从显示对象的内容到屏幕,到对一组局部属性和参数执行复杂的数学运算,方法都很有用。

例如 - 以下是一个简单示例,说明如何使用document对象的write()方法在文档上写入任何内容。

document.write("This is test");

用户定义的对象

所有用户定义的对象和内置对象都是名为Object的对象的后代。

new运算符

new运算符用于创建对象的实例。 要创建对象,new运算符后跟构造方法。

在以下示例中,构造函数方法是Object(),Array()和Date()。 这些构造函数是内置的JavaScript函数。

var employee = new Object();
var books = new Array("C++", "Perl", "Java");
var day = new Date("August 15, 1947");

Object()构造函数

构造函数是一个创建和初始化对象的函数。 JavaScript提供了一个名为Object()的特殊构造函数来构建对象。 Object()构造函数的返回值被赋给变量。

该变量包含对新对象的引用。 分配给对象的属性不是变量,也不是使用var关键字定义的。

试试下面的例子; 它演示了如何创建一个Object。

<html>
   <head>
	  <title>User-defined objects</title>
	  
	  <script type="text/javascript">
		 var book = new Object();   // Create the object
		 book.subject = "Perl"; // Assign properties to the object
		 book.author  = "Mohtashim";
	  </script>
	  
   </head>
   
   <body>
   
	  <script type="text/javascript">
		 document.write("Book name is : " + book.subject + "<br>");
		 document.write("Book author is : " + book.author + "<br>");
	  </script>
   
   </body>
</html>
Book name is : Perl 
Book author is : Mohtashim

此示例演示如何使用用户定义的函数创建对象。 this关键字用于指代已传递给函数的对象。

<html>
   <head>
   
   <title>User-defined objects</title>
   
	  <script type="text/javascript">
		 function book(title, author){
			this.title = title; 
			this.author  = author;
		 }
	  </script>
	  
   </head>
   <body>
   
	  <script type="text/javascript">
		 var myBook = new book("Perl", "Mohtashim");
		 document.write("Book title is : " + myBook.title + "<br>");
		 document.write("Book author is : " + myBook.author + "<br>");
	  </script>
	  
   </body>
</html>
Book title is : Perl 
Book author is : Mohtashim

定义对象的方法

前面的示例演示了构造函数如何创建对象并分配属性。 但我们需要通过为其分配方法来完成对象的定义。

试试下面的例子; 它显示了如何与对象一起添加函数。

<html>
   <head>
   <title>User-defined objects</title>
   
	  <script type="text/javascript">
		 // Define a function which will work as a method
		 function addPrice(amount){
			this.price = amount; 
		 }
		 
		 function book(title, author){
			this.title = title;
			this.author  = author;
			this.addPrice = addPrice; // Assign that method as property.
		 }
	  </script>
	  
   </head>
   <body>
   
	  <script type="text/javascript">
		 var myBook = new book("Perl", "Mohtashim");
		 myBook.addPrice(100);
		 
		 document.write("Book title is : " + myBook.title + "<br>");
		 document.write("Book author is : " + myBook.author + "<br>");
		 document.write("Book price is : " + myBook.price + "<br>");
	  </script>
	  
   </body>
</html>
Book title is : Perl 
Book author is : Mohtashim 
Book price is : 100

'with' 关键词

'with'关键字用作引用对象属性或方法的一种简写。

指定为with的参数的对象将成为后续块的持续时间的默认对象。 可以在不命名对象的情况下使用对象的属性和方法。

语法

with object的语法如下 −

with (object){
   properties used without the object name and dot
}

请尝试以下示例。

<html>
   <head>
   <title>User-defined objects</title>
   
	  <script type="text/javascript">
		 // Define a function which will work as a method
		 function addPrice(amount){
			with(this){
			   price = amount;
			}
		 }
		 
		 function book(title, author){
			this.title = title;
			this.author  = author;
			this.price = 0;
			this.addPrice = addPrice; // Assign that method as property.
		 }
	  </script>
	  
   </head>
   <body>
   
	  <script type="text/javascript">
		 var myBook = new book("Perl", "Mohtashim");
		 myBook.addPrice(100);
		 
		 document.write("Book title is : " + myBook.title + "<br>");
		 document.write("Book author is : " + myBook.author + "<br>");
		 document.write("Book price is : " + myBook.price + "<br>");
	  </script>
	  
   </body>
</html>
Book title is : Perl 
Book author is : Mohtashim 
Book price is : 100

JavaScript原生对象

JavaScript有几个内置或本机对象。 这些对象可以在程序中的任何位置访问,并且可以在任何操作系统中运行的任何浏览器中以相同的方式工作

Number

Number对象

Number对象表示数字日期,可以是整数或浮点数。 通常,您不需要担心Number对象,因为浏览器会自动将数字文字转换为数字类的实例。

语法

创建Number对象的语法如下 - −

var val = new Number(number);

在number的位置,如果你提供任何非数字参数,那么参数不能转换为数字,它返回NaN(非数字)。

Number属性

以下是每个属性及其描述的列表。

序号 属性 & 描述
1 MAX_VALUE
JavaScript中数字的最大值是1.7976931348623157E+308
2 MIN_VALUE
JavaScript中的数字的最小值是5E-324
3 NaN
等于不是数字的值。
4 NEGATIVE_INFINITY
小于MIN_VALUE的值.
5 POSITIVE_INFINITY
大于MAX_VALUE的值.
6 prototype
Number对象的静态属性。 使用prototype属性将新属性和方法分配给当前文档中的Number对象
7 constructor
返回创建此对象实例的函数。 默认情况下,这是Number对象。

在以下部分中,我们将通过一些示例来演示Number的属性。

prototype

prototype属性允许您向任何对象添加属性和方法(Number,Boolean,String和Date等)。

注 - Prototype是一个全局属性,几乎可用于所有对象。

语法

使用以下语法来使用Prototype。

object.prototype.name = value

请尝试以下示例以使用prototype属性向对象添加属性。

<html>
	<head>
		<title>User-defined objects</title>

		<script type="text/javascript">
			function book(title, author){
				this.title = title;
				this.author  = author;
			}
		</script>

	</head>
	<body>

	<script type="text/javascript">
		var myBook = new book("Perl", "Mohtashim");
		book.prototype.price = null;
		myBook.price = 100;

		document.write("Book title is : " + myBook.title + "<br>");
		document.write("Book author is : " + myBook.author + "<br>");
		document.write("Book price is : " + myBook.price + "<br>");
		</script>

	</body>
</html>
Book title is : Perl
Book author is : Mohtashim
Book price is : 100

Number方法

Number对象仅包含作为每个对象定义一部分的默认方法。

序号 属性 & 描述
1 toExponential()
强制数字以指数表示法显示,即使该数字在JavaScript通常使用标准表示法的范围内。
2 toFixed()
格式化小数点右侧具有特定位数的数字。
3 toLocaleString()
以可能根据浏览器的本地设置而变化的格式返回当前数字的字符串值版本。
4 toPrecision()
定义显示数字的总位数(包括小数点左侧和右侧的数字)。
5 toString()
返回数字值的字符串表示形式。
6 valueOf()
返回数字的值。

在以下部分中,我们将通过一些示例来解释Number的方法。

toExponential()

此方法以指数表示法返回表示数字对象的字符串。

语法

其语法如下 −

number.toExponential( [fractionDigits] )

参数

fractionDigits - 一个整数,指定小数点后的位数。 默认为指定数字所需的位数。

返回值

一个字符串,表示以小数点前一位数的指数表示法中的Number对象,四舍五入到小数点后面的fractionDigits数字。 如果省略fractionDigits参数,则小数点后的位数默认为唯一表示该值所需的位数。

例子

<html>
	<head>
		<title>Javascript Method toExponential()</title>
	</head>
	
	<body>
		<script type="text/javascript">
			var num=77.1234;
			var val = num.toExponential();
			document.write("num.toExponential() is : " + val );
			document.write("<br />");
			
			val = num.toExponential(4);
			document.write("num.toExponential(4) is : " + val );
			document.write("<br />");
			
			val = num.toExponential(2);
			document.write("num.toExponential(2) is : " + val);
			document.write("<br />");
			
			val = 77.1234.toExponential();
			document.write("77.1234.toExponential()is : " + val );
			document.write("<br />");
			
			val = 77.1234.toExponential();
			document.write("77 .toExponential() is : " + val);
		</script>
	
	</body>
</html>
num.toExponential() is : 7.71234e+1
num.toExponential(4) is : 7.7123e+1
num.toExponential(2) is : 7.71e+1
77.1234.toExponential()is:7.71234e+1
77 .toExponential() is : 7.71234e+1

Boolean

Boolean对象

Boolean对象表示两个值,“true”或“false”。 如果省略value参数或者为0,-0,null,false,NaN,undefined或空字符串(“”),则对象的初始值为false。

语法

使用以下语法创建boolean对象。

var val = new Boolean(value);

Boolean属性

以下是Boolean对象的属性列表 −

序号 属性 & 描述
1 constructor
返回对创建对象的Boolean函数的引用。
2 prototype
prototype属性允许您向对象添加属性和方法。

在以下部分中,我们将通过一些示例来说明Boolean对象的属性。

Boolean constructor()

Javascript boolean constructor()方法返回对创建实例原型的Boolean函数的引用。

语法

使用以下语法创建布尔构造函数()方法。

boolean.constructor()

返回值

返回函数创建的对象实例。

<html>
	<head>
		<title>JavaScript constructor() Method</title>
	</head>
	
	<body>
	
		<script type="text/javascript">
			var bool = new Boolean( );
			document.write("bool.constructor() is:"+bool.constructor);
		</script>
	
	</body>
</html>
bool.constructor() is : function Boolean() { [native code] }

Boolean方法

以下是布尔对象及其描述的方法列表。

序号 方法 & 描述
1 toSource()
返回包含Boolean对象源的字符串; 您可以使用此字符串来创建等效对象。
2 toString()
返回“true”或“false”的字符串,具体取决于对象的值。
3 valueOf()
返回Boolean对象的原始值。

在以下部分中,我们将通过一些示例来演示布尔方法的用法。

Boolean toSource()

Javascript boolean toSource()方法返回表示对象源代码的字符串。

注意 - 此方法与所有浏览器不兼容。

语法

其语法如下 −

boolean.toSource()

返回值

返回表示对象源代码的字符串。

例子

<html>
	<head>
		<title>JavaScript toSource() Method</title>
	</head>
	
	<body>
	
		<script type="text/javascript">
			function book(title, publisher, price)
			{
				this.title = title;
				this.publisher = publisher;
				this.price = price;
			}
		
			var newBook = new book("Perl","Leo Inc",200);
			document.write(newBook.toSource());
		</script>
	
	</body>
</html>

输出

({title:"Perl", publisher:"Leo Inc", price:200})

String

String对象允许您使用一系列字符; 它使用许多辅助方法包装Javascript的字符串原始数据类型。

由于JavaScript自动在字符串基元和String对象之间进行转换,因此可以在字符串基元上调用String对象的任何辅助方法。

语法

使用下面语法创建一个字符串对象 −

var val = new String(string);

String参数是一系列已正确编码的字符。

String属性

以下是String对象及其描述的属性列表。

序号 属性 & 描述
1 constructor
返回对创建对象的String函数的引用。
2 length
返回字符串长度
3 prototype
prototype属性允许您向对象添加属性和方法。

在以下部分中,我们将通过一些示例来演示String属性的用法。

String方法

以下是String对象中可用方法的列表及其描述。

序号 方法 & 描述
1 charAt()
返回指定索引处的字符。
2 charCodeAt()
返回一个数字,指示给定索引处字符的Unicode值。
3 concat()
合并两个字符串的文本并返回一个新字符串。
4 indexOf()
返回第一次出现的指定值的调用String对象中的索引,如果未找到,则返回-1。
5 lastIndexOf()
返回最后一次出现的指定值的调用String对象中的索引,如果未找到,则返回-1。
6 localeCompare()
返回一个数字,指示引用字符串是在排序顺序之前还是之后出现,或者与排序顺序中的给定字符串相同。
7 match()
用于将正则表达式与字符串匹配。
8 replace()
用于查找正则表达式和字符串之间的匹配,并使用新的子字符串替换匹配的子字符串。
9 search()
执行搜索正则表达式与指定字符串之间的匹配项。
10 slice()
提取字符串的一部分并返回一个新字符串。
11 split()
通过将字符串分隔为子字符串将String对象拆分为字符串数组。
12 substr()
返回从指定位置开始通过指定字符数的字符串中的字符。
13 substring()
将两个索引之间的字符串中的字符返回到字符串中。
14 toLocaleLowerCase()
在尊重当前区域设置的同时,字符串中的字符将转换为小写字母。
15 toLocaleUpperCase()
在尊重当前语言环境的同时,字符串中的字符将转换为大写字母。
16 toLowerCase()
返回转换为小写的调用字符串值。
17 toString()
返回表示指定对象的字符串。
18 toUpperCase()
返回转换为大写的调用字符串值。
19 valueOf()
返回指定对象的原始值。

String HTML Wrappers

以下是返回包含在相应HTML标记内的字符串的方法列表。

序号 方法 & 描述
1 anchor()
创建用作超文本目标的HTML锚点。/td>
2 big()
创建一个以大字体显示的字符串,就像它在 <big> 标签一样.
3 blink()
创建一个闪烁的字符串,就像它在<blink>标记中一样。
4 bold()
创建一个字符串,显示为粗体,就像它在<b>标签中一样。
5 fixed()
使字符串以固定间距字体显示,就像它在<tt>标记中一样
6 fontcolor()
使字符串以指定的颜色显示,就像它在<font color="color">标记中一样。
7 fontsize()
使字符串以指定的字体大小显示,就像它在<font size="size">标记中一样。
8 italics()
使字符串变为斜体,就好像它位于<i>标记中一样。
9 link()
创建请求其他URL的HTML超文本链接。
10 small()
使字符串以小字体显示,就像它在<small>标记中一样。
11 strike()
导致字符串显示为删除文本,就像它在<strike>标记中一样。
12 sub()
使字符串显示为下标,就好像它位于<sub>标记中一样
13 sup()
使字符串显示为上标,就好像它位于<sup>标记中一样

数组

Array对象允许您在单个变量中存储多个值。 它存储固定大小的相同类型元素的顺序集合。 数组用于存储数据集合,但将数组视为相同类型的变量集合通常更有用。

语法

使用以下语法创建Array对象 −

var fruits = new Array( "apple", "orange", "mango" );

Array参数是字符串或整数的列表。 使用Array构造函数指定单个数字参数时,可以指定数组的初始长度。 数组允许的最大长度为4,294,967,295。

您可以通过简单地分配值来创建数组,如下所示 −

var fruits = [ "apple", "orange", "mango" ];

您将使用序号来访问和设置数组内的值,如下所示。

fruits[0] is the first element
fruits[1] is the second element
fruits[2] is the third element

数组属性

以下是Array对象的属性列表及其描述。

序号 属性 & 描述
1 constructor
返回对创建对象的数组函数的引用。
2 index
该属性表示字符串中匹配的从零开始的索引
3 input
此属性仅存在于由正则表达式匹配创建的数组中。
4 length
反映数组中的元素数。
5 prototype
prototype属性允许您向对象添加属性和方法。

数组方法

以下是Array对象的方法列表及其描述。

序号 方法 & 描述
1 concat()
返回由此数组与其他数组和/或值连接组成的新数组。
2 every()
如果此数组中的每个元素都满足提供的测试函数,则返回true。
3 filter()
创建一个新数组,其中包含此数组的所有元素,其中提供的过滤函数返回true。
4 forEach()
为数组中的每个元素调用一个函数。
5 indexOf()
返回数组中元素的第一个(最小)索引,该索引等于指定的值,如果没有找到,则返回-1。
6 join()
将数组的所有元素连接成一个字符串。
7 lastIndexOf()
返回数组中元素的最后一个(最大)索引,该索引等于指定值,如果未找到,则返回-1。
8 map()
创建一个新数组,其结果是在此数组中的每个元素上调用提供的函数。
9 pop()
从数组中删除最后一个元素并返回该元素。
10 push()
将一个或多个元素添加到数组的末尾并返回数组的新长度。
11 reduce()
同时对阵列的两个值(从左到右)应用函数,以将其减少为单个值。
12 reduceRight()
同时对阵列的两个值(从右到左)应用函数,以将其减少为单个值。
13 reverse()
反转数组元素的顺序 - 第一个成为最后一个,最后一个成为第一个。
14 shift()
从数组中删除第一个元素并返回该元素。
15 slice()
提取数组的一部分并返回一个新数组。
16 some()
如果此数组中至少有一个元素满足提供的测试函数,则返回true。
17 toSource()
表示对象的源代码
18 sort()
对数组的元素进行排序
19 splice()
添加和/或从数组中删除元素。
20 toString()
返回表示数组及其元素的字符串。
21 unshift()
将一个或多个元素添加到数组的前面,并返回数组的新长度。

Date

Date对象是JavaScript语言中内置的数据类型。 使用新的Date()创建日期对象,如下所示。

创建Date对象后,可以使用许多方法对其进行操作。 大多数方法只允许您使用本地时间或UTC(通用或GMT)时间来获取和设置对象的年,月,日,小时,分钟,秒和毫秒字段。

ECMAScript标准要求Date对象能够在1970年1月1日之前或之后的1亿天内以毫秒精度表示任何日期和时间。 这是正负273,785年的范围,因此JavaScript可以表示直到275755年的日期和时间。

语法

您可以使用以下任何语法来使用Date()构造函数创建Date对象。

new Date( )
new Date(milliseconds)
new Date(datestring)
new Date(year,month,date[,hour,minute,second,millisecond ])

注:括号中的参数始终是可选的。

以下是参数的说明 −

  • 没有参数,Date()构造函数创建一个Date对象,设置为当前日期和时间。
  • 毫秒 - 当传递一个数字参数时,它将被视为日期的内部数字表示形式(以毫秒为单位),由getTime()方法返回。 例如,传递参数5000会创建一个日期,表示在1/1/70午夜过后五秒。
  • datestring - 当传递一个字符串参数时,它是日期的字符串表示形式,采用Date.parse()方法接受的格式。
  • 7个参数 - 使用上面显示的结构的最后一种形式。 以下是每个论点的描述 -
    • year - 表示年份的整数值。 为了兼容性(为了避免Y2K问题),您应该始终指定年份; 使用1998年,而不是98年。
    • month - 表示月份的整数值,从1月的0开始到12月的11。
    • date - 表示月中某天的整数值。
    • 小时 - 表示一天中小时的整数值(24小时)。
    • minute - 表示时间读数的分钟段的整数值。
    • second - 表示时间读数的第二段的整数值。
    • millisecond - 表示时间读数的毫秒段的整数值。

Date属性

以下是Date对象的属性列表及其说明。/p>

序号 属性 & 描述
1 constructor
指定创建对象原型的函数。
2 prototype
prototype属性允许您向对象添加属性和方法

 

Date方法

以下是与Date及其描述一起使用的方法列表。

序号 方法 & 描述
1 Date()
返回今天的日期和时间
2 getDate()
根据当地时间返回指定日期的月中某天。
3 getDay()
根据当地时间返回指定日期的星期几。
4 getFullYear()
根据当地时间返回指定日期的年份。
5 getHours()
根据当地时间返回指定日期的小时。
6 getMilliseconds()
根据本地时间返回指定日期的毫秒数。
7 getMinutes()
根据当地时间返回指定日期的分钟数。
8 getMonth()
根据当地时间返回指定日期的月份。
9 getSeconds()
根据本地时间返回指定日期的秒数。
10 getTime()
返回指定日期的数值,作为自1970年1月1日00:00:00 UTC以来的毫秒数。
11 getTimezoneOffset()
返回当前语言环境的时区偏移量(以分钟为单位)。
12 getUTCDate()
根据通用时间返回指定日期中月份的日期(日期)。
13 getUTCDay()
根据通用时间返回指定日期的星期几。
14 getUTCFullYear()
根据通用时间返回指定日期的年份。
15 getUTCHours()
根据通用时间返回指定日期的小时数。
16 getUTCMilliseconds()
根据通用时间返回指定日期的毫秒数。
17 getUTCMinutes()
根据通用时间返回指定日期的分钟数。
18 getUTCMonth()
根据通用时间返回指定日期的月份。
19 getUTCSeconds()
根据通用时间返回指定日期的秒数。
20 getYear()
Deprecated - 根据当地时间返回指定日期的年份。 请改用getFullYear。
21 setDate()
根据当地时间设置指定日期的月中某天。
22 setFullYear()
根据当地时间设置指定日期的全年。
23 setHours()
根据当地时间设置指定日期的小时数。
24 setMilliseconds()
根据本地时间设置指定日期的毫秒数。
25 setMinutes()
根据当地时间设置指定日期的分钟数。
26 setMonth()
根据当地时间设置指定日期的月份。
27 setSeconds()
根据本地时间设置指定日期的秒数。
28 setTime()
将Date对象设置为自1970年1月1日00:00:00 UTC以来的毫秒数表示的时间。
29 setUTCDate()
根据通用时间设置指定日期的月中某天。
30 setUTCFullYear()
根据通用时间设置指定日期的全年。
31 setUTCHours()
根据通用时间设置指定日期的小时。
32 setUTCMilliseconds()
根据通用时间设置指定日期的毫秒数。
33 setUTCMinutes()
根据通用时间设置指定日期的分钟数。
34 setUTCMonth()
根据通用时间设置指定日期的月份。
35 setUTCSeconds()
根据通用时间设置指定日期的秒数。
36 setYear()
Deprecated - 根据当地时间设置指定日期的年份。 请改用setFullYear。
37 toDateString()
返回Date的“date”部分作为字符串。
38 toGMTString()
Deprecated - 使用Internet GMT约定将日期转换为字符串。 请改用toUTCString。
39 toLocaleDateString()
使用当前语言环境的约定,以字符串形式返回Date的“date”部分。
40 toLocaleFormat()
使用格式字符串将日期转换为字符串。
41 toLocaleString()
使用当前语言环境的约定将日期转换为字符串。
42 toLocaleTimeString()
使用当前语言环境的约定,以字符串形式返回Date的“time”部分。
43 toSource()
返回表示等效Date对象的源的字符串; 您可以使用此值来创建新对象。
44 toString()
返回表示指定Date对象的字符串。
45 toTimeString()
返回Date的“time”部分作为字符串。
46 toUTCString()
使用通用时间约定将日期转换为字符串。
47 valueOf()
返回Date对象的原始值。

Date静态方法

除了前面列出的许多实例方法之外,Date对象还定义了两个静态方法。 这些方法是通过Date()构造函数本身调用的。

序号 方法 & 属性
1 Date.parse( )
解析日期和时间的字符串表示形式,并返回该日期的内部毫秒表示形式。
2 Date.UTC( )
返回指定的UTC日期和时间的毫秒表示形式。

Math

Math对象为数学常量和函数提供了属性和方法。 与其他全局对象不同,Math不是构造函数。 Math的所有属性和方法都是静态的,可以使用Math作为对象来调用而不创建它。

因此,您将常量pi称为Math.PI,并将正弦函数称为Math.sin(x),其中x是方法的参数。

语法

调用Math的属性和方法的语法如下

var pi_val = Math.PI;
var sine_val = Math.sin(30);

Math属性

以下是数学及其描述的所有属性的列表。

序号 属性 & 描述
1 E \
欧拉常数和自然对数的基数,约为2.718。
2 LN2
自然对数为2,约为0.693。
3 LN10
自然对数为10,约为2.302。
4 LOG2E
基数为2的对数,约为1.442。
5 LOG10E
基数为E的对数10,约为0.434。
6 PI
圆周长与直径之比约为3.14159。
7 SQRT1_2
平方根为1/2; 等价地,1平方根上的1,大约0.707。
8 SQRT2
平方根2,约1.414。

Math方法

以下是与Math对象及其描述相关的方法列表

序号 方法 & 描述
1 abs()
返回数字的绝对值。
2 acos()
返回数字的反余弦(以弧度表示)。
3 asin()
返回数字的反正弦(以弧度表示)。
4 atan()
返回数字的反正切(以弧度表示)。
5 atan2()
返回其参数的商的反正切值。
6 ceil()
返回大于或等于数字的最小整数。
7 cos()
返回数字的余弦值。
8 exp()
返回 EN, 其中N是参数,E是欧拉常数,是自然对数的基数。
9 floor()
返回小于或等于数字的最大整数。
10 log()
返回数字的自然对数(基数E)。
11 max()
返回零个或多个数字中的最大值。
12 min()
返回零个或多个数字中的最小值。
13 pow()
返回指数幂的基数,即基数指数。
14 random()
返回0到1之间的伪随机数。
15 round()
返回舍入到最接近整数的数字的值。
16 sin()
返回数字的正弦值。
17 sqrt()
返回数字的平方根。
18 tan()
返回数字的正切值。
19 toSource()
返回字符串“Math”。

正则表达式

正则表达式是描述字符模式的对象。

JavaScript RegExp类表示正则表达式,String和RegExp都定义了使用正则表达式在文本上执行强大的模式匹配和搜索和替换功能的方法。

语法

可以使用RegExp()构造函数定义正则表达式,如下所示 −

var pattern = new RegExp(pattern, attributes);
	
or simply
	
var pattern = /pattern/attributes;

这是参数的描述 −

  • pattern - 一个字符串,它指定正则表达式或另一个正则表达式的模式。
  • attributes - 一个可选字符串,包含分别指定全局,不区分大小写和多行匹配的任何“g”,“i”和“m”属性。

括号

在正则表达式的上下文中使用时,括号([])具有特殊含义。 它们用于查找一系列字符。

序号 表达式 & 描述
1 [...]
括号内的任何一个字符。
2 [^...]
任何一个字符不在括号之间。
3 [0-9]
它匹配从0到9的任何十进制数字。
4 [a-z]
它匹配从小写字母a到小写字母z的任何字符。
5 [A-Z]
它匹配从大写A到大写Z的任何字符。
6 [a-Z]
它匹配从小写字母a到大写字母Z的任何字符。

上面显示的范围是一般的; 您还可以使用范围[0-3]匹配范围从0到3的任何十进制数字,或范围[b-v]以匹配范围从b到v的任何小写字符。

特殊字符

括号中的字符序列和单个字符的频率或位置可以用特殊字符表示。 每个特殊字符都有特定的含义。 +,*,?和$标志都遵循字符序列。

序号 表达式 & 描述
1 p+
它匹配包含一个或多个p的任何字符串。
2 p*
它匹配包含零个或多个p的任何字符串。
3 p?
它匹配任何包含至多一个p的字符串。
4 p{N}
它匹配包含N p序列的任何字符串
5 p{2,3}
它匹配包含两个或三个p的序列的任何字符串。
6 p{2, }
它匹配包含至少两个p的序列的任何字符串。
7 p$
它匹配任何字符串,其末尾为p。
8 ^p
它匹配任何字符串,在它的开头有p。

例子

以下示例详细介绍了匹配字符。

序号 表达式 & 描述
1 [^a-zA-Z]
它匹配任何不包含从a到z和A到Z的任何字符的字符串。
2 p.p
它匹配任何包含p的字符串,后跟任何字符,然后是另一个p。
3 ^.{2}$
它匹配任何包含两个字符的字符串。
4 <b>(.*)</b>
它匹配<b> 和 </b>中包含的任何字符串。
5 p(hp)*
它匹配任何包含p的字符串,后跟零个或多个序列hp的实例。

常量字符

序号 字符 & 描述
1 Alphanumeric
字母
2 \0
空字符 (\u0000)
3 \t
Tab (\u0009
4 \n
新行 (\u000A)
5 \v
垂直tab (\u000B)
6 \f
换页符 (\u000C)
7 \r
回车符 (\u000D)
8 \xnn
由十六进制数nn指定的拉丁字符; 例如,\x0A与\n相同
9 \uxxxx
由十六进制数xxxx指定的Unicode字符; 例如,\u0009与\t相同
10 \cX
控制字符^X; 例如,\cJ等同于换行符\n

元字符

元字符只是一个字母字符,前面是反斜杠,用于赋予组合特殊含义。

例如,你可以使用'\d'元字符搜索:/([\d]+)000/,这里\d将搜索任何数字字符串。

下表列出了一组可在PERL样式正则表达式中使用的元字符。

序号 字符 & 描述
1 .
单个字符
2 \s
空格字符(空格,制表符,换行符)
3 \S
非空白字符
4 \d
一个数字(0-9)
5 \D
一个非数字
6 \w
一个单词字符(a-z,A-Z,0-9,_)
7 \W
一个非单词字符
8 [\b]
文字退格(特殊情况)。
9 [aeiou]
匹配给定集合中的单个字符
10 [^aeiou]
匹配给定集合之外的单个字符
11 (foo|bar|baz)
匹配指定的任何替代方案

修饰符

有几种修饰符可以简化你使用regexp的方式,例如区分大小写,多行搜索等。

序号 修饰符 & 描述
1 i
执行不区分大小写的匹配。
2 m
指定如果字符串具有换行符或回车符,则^和$运算符现在将与换行符边界匹配,而不是字符串边界
3 g
执行全局匹配,即找到所有匹配而不是在第一次匹配后停止。

RegExp属性

以下是与RegExp相关的属性列表及其说明。

序号 属性 & 描述
1 constructor
指定创建对象原型的函数。
2 global
指定是否设置“g”修饰符。
3 ignoreCase
指定是否设置“i”修饰符。
4 lastIndex
开始下一次匹配的索引位置。
5 multiline
指定是否设置“m”修饰符。
6 source
模式的文本。

RegExp lastIndex属性

描述

lastIndex是RegExp对象的读/写属性。 对于设置了“g”属性的正则表达式,它包含一个整数,该整数指定紧跟RegExp.exec()和RegExp.test()方法找到的最后一个匹配之后的字符位置。 这些方法使用此属性作为下一次搜索的起点。

此属性允许您重复调用这些方法,循环遍历字符串中的所有匹配项,并且仅在设置了“g”修饰符时才起作用。

此属性是可读/写的,因此您可以随时设置它以指定目标字符串中的下一个搜索应该开始的位置。 exec()和test()在找不到匹配项(或其他匹配项)时自动将lastIndex重置为0。

语法

其语法如下 −

RegExpObject.lastIndex

返回值

返回一个整数,指定紧跟在最后一个匹配项后的字符位置。

例子

<html>
	
	<head>
		<title>JavaScript RegExp lastIndex Property</title>
	</head>
	
	<body>
	
		<script type="text/javascript">
			var str = "Javascript is an interesting scripting language";
			var re = new RegExp( "script", "g" );
			
			re.test(str);
			document.write("Test 1 - Current Index: " +  re.lastIndex);
			
			re.test(str);
			document.write("<br />Test 2 - Current Index: " + re.lastIndex);
		</script>
	
	</body>
</html>

输出

Test 1 - Current Index: 10
Test 2 - Current Index: 35

RegExp方法

以下是与RegExp相关的方法列表及其说明。

序号 方法 & 描述
1 exec()
在其字符串参数中执行匹配搜索。
2 test()
在其字符串参数中测试匹配项。
3 toSource()
返回表示指定对象的对象文字; 您可以使用此值来创建新对象。
4 toString()
返回表示指定对象的字符串。

RegExp exec方法

描述

exec方法在字符串中搜索与正则表达式匹配的文本。 如果找到匹配项,则返回结果数组; 否则,它返回null。

语法

其语法如下 −

RegExpObject.exec( string );

参数细节

string - 要搜索的字符串

返回值

如果找到匹配则返回匹配的文本,否则返回null。

例子

<html>
	
	<head>
		<title>JavaScript RegExp exec Method</title>
	</head>
	
	<body>
	
		<script type="text/javascript">
			var str = "Javascript is an interesting scripting language";
			var re = new RegExp( "script", "g" );
			
			var result = re.exec(str);
			document.write("Test 1 - returned value : " +  result);
			
			re = new RegExp( "pushing", "g" );
			
			var result = re.exec(str);
			document.write("<br />Test 2 - returned value : " +  result);
		</script>
	
	</body>
</html>

输出

Test 1 - returned value : script
Test 2 - returned value : null

HTML DOM

每个网页都位于浏览器窗口内,可以将其视为对象。

Document对象表示在该窗口中显示的HTML文档。 Document对象具有各种属性,这些属性引用允许访问和修改文档内容的其他对象。

访问和修改文档内容的方式称为文档对象模型或DOM。 对象按层次结构组织。 此分层结构适用于Web文档中对象的组织。

  • Window object − 层次结构的顶部。 它是对象层次结构的最外层元素。
  • Document object − 加载到窗口中的每个HTML文档都成为文档对象。 该文档包含页面的内容。
  • Form object − <form>...</form>标记中包含的所有内容都会设置表单对象。
  • Form control elements − 表单对象包含为该对象定义的所有元素,例如文本字段,按钮,单选按钮和复选框。

这是一些重要对象的简单层次结构 −

有几个DOM存在。 以下部分详细说明了每个DOM,并描述了如何使用它们来访问和修改文档内容。

  • Legacy DOM - 这是在早期版本的JavaScript语言中引入的模型。 它得到了所有浏览器的良好支持,但只允许访问文档的某些关键部分,例如表单,表单元素和图像。
  • W3C DOM - 此文档对象模型允许访问和修改所有文档内容,并由万维网联盟(W3C)标准化。 几乎所有现代浏览器都支持此模型。
  • IE4 DOM - 此文档对象模型是在Microsoft Internet Explorer浏览器的第4版中引入的。 IE 5及更高版本包括对大多数基本W3C DOM功能的支持。

DOM兼容性

如果您想编写一个可以灵活使用W3C DOM或IE 4 DOM的脚本,具体取决于它们的可用性,那么您可以使用一种能力测试方法,首先检查方法或属性是否存在,以确定浏览器是否具有 你想要的能力。 例如 - −

if (document.getElementById) {
	// If the W3C method exists, use it
}
	
else if (document.all) {
	// If the all[] array exists, use it
}
	
else {
	// Otherwise use the legacy DOM
}

 

暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇