JavaScript对象

一、对象简介

JavaScript 是面向对象的编程语言 (OOP)。OOP 语言使我们有能力定义自己的对象和变量类型。注意：对象只是一种特殊的数据。对象拥有属性和方法。

1、属性：指与对象有关的值。

eg：使用字符串对象的长度属性来计算字符串中的字符数目。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS</title>

 </head>

 <body>

     <script type="text/javascript">

         var str = "Hello World!";

         document.write(str.length);

     </script>

 </body>

 </html>

　　结果：（空格也包含在内）

2、方法：指对象可以执行的行为（或者可以完成的功能）。

eg：使用字符串对象的 toUpperCase() 方法来显示大写字母文本。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS</title>

 </head>

 <body>

     <script type="text/javascript">

         var str = "Hello World!";

         document.write(str.toUpperCase());   //注意方法的大小写！！！

     </script>

 </body>

 </html>

　　效果：

二、字符串（String）

　　String 对象用于处理已有的字符块。

1、String对象属性

2、String 对象方法

3、实例：

　　（1）indexOf():用来定位字符串中某一个指定的字符首次出现的位置。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS</title>

 </head>

 <body>

     <script type="text/javascript">

         var str = "Hello World!";

         document.write(str.indexOf("Hello") + "<br />")

         document.write(str.indexOf("World") + "<br />")

         document.write(str.indexOf("world"))

     </script>

 </body>

 </html>

　　　　效果：

　　（2）match() ：用来查找字符串中特定的字符，并且如果找到的话，则返回这个字符。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS</title>

 </head>

 <body>

     <script type="text/javascript">

         var str = "Hello World!";

         document.write(str.match("world") + "<br />")

         document.write(str.match("World") + "<br />")

         document.write(str.match("worlld") + "<br />")

         document.write(str.match("world!"))

     </script>

 </body>

 </html>

　　　　效果：

　　（3） replace() 方法：使用其在字符串中用某些字符替换另一些字符。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS</title>

 </head>

 <body>

     <script type="text/javascript">

         var str = "Hello World!";

         document.write(str.replace(/World/,"Boy"));     //注意大小写！！！

     </script>

 </body>

 </html>

　　　　　　效果：

三、JavaScript Date（日期）对象　　

　　日期对象用于处理日期和时间。

1、定义日期

var myDate=new Date()

　　Date 对象自动使用当前的日期和时间作为其初始值。

2、改变日期

　　（1）为日期对象设置一个特定的日期 (2008 年 8 月 9 日)：

var myDate=new Date()

myDate.setFullYear(2008,7,9)

　　**表示月份的参数介于 0 到 11 之间。也就是说，如果希望把月设置为 8 月，则参数应该是 7。**

　（2）将日期对象设置为 5 天后的日期：

var myDate=new Date()

myDate.setDate(myDate.getDate()+5)

　　**如果增加天数会改变月份或者年份，那么日期对象会自动完成这种转换。**

3、Date 对象属性

4、Date 对象方法

5、实例

　　（1）使用 getDay() 来显示星期，而不仅仅是数字。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JavaScript</title>

 </head>

 <script type="text/javascript">

     var d=new Date();

     var weekday=new Array(7);

     weekday[0]="星期日";

     weekday[1]="星期一";

     weekday[2]="星期二";

     weekday[3]="星期三;"

     weekday[4]="星期四";

     weekday[5]="星期五";

     weekday[6]="星期六";

     document.write("今天是" + weekday[d.getDay()]);

 </script>

 <body>

 </body>

 </html>

　　效果：

　　（2）显示一个钟表

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS</title>

 </head>

 <script type="text/javascript">

     function startTime() {

         var today=new Date();

         var h=today.getHours();   //返回当前的时针

         var m=today.getMinutes();   //返回当前的分针

         var s=today.getSeconds();    //返回当前的秒针

         m=checkTime(m);

         s=checkTime(s);

         document.getElementById('txt').innerHTML=h+":"+m+":"+s;    //innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。

         t=setTimeout('startTime()',500);    //javascript通过setTimeout函数暂停一段时间后执行，这里每隔500ms就调用一次代码

     }

     function checkTime(i) {

         if (i<10)  {i="0" + i;}     //如果分、秒为个位数，在前面+“0”，这一步很重要

           return i;

         }

 </script>

 <body onload="startTime()">

     <div id="txt"></div>

 </body>

 </html>

　　效果：

四、JavaScript Array（数组）对象

1、定义数组

var myArray=new Array()

2、变量赋值
　　（1）可以添加任意多的值，就像可以定义需要的任意多的变量一样

var mycars=new Array()；

mycars[0]="Saab"；

mycars[1]="Volvo"；

mycars[2]="BMW"；

　　可以使用一个整数自变量来控制数组的容量：

var mycars=new Array(3)

mycars[0]="Saab"；

mycars[1]="Volvo"；

mycars[2]="BMW"；

　　（2）

var mycars=new Array("Saab","Volvo","BMW")

　　注意：如果你需要在数组内指定数值或者逻辑值，那么变量类型应该是数值变量或者布尔变量，而不是字符变量。

3、Array 对象属性

4、Array 对象方法

5、实例:

　　(1)输出数组中的元素

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JavaScript</title>

 </head>

 <script type="text/javascript">

     var i,j;

     var text = new Array("张三","李四","王五");

     document.write("1.用for语句来循环输出:"+"<br>");

     for(i=0;i<text.length;i++) {

         document.write(text[i] + "<br>");

     }

     document.write("2.用for...in...语句来循环输出:" + "<br>");

     for( j in text) {

         document.write(text[j] + "<br>");

     }

 </script>

 <body>

 </body>

 </html>

效果：注意：取数组名时不要和关键字重复，否则运行结果会出错。

　　(2)合并两个数组：concat()

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>js</title>

 </head>

 <body>

 <script type="text/javascript">

     var arr = new Array(3);

     arr[0] = "George";

     arr[1] = "John";

     arr[2] = "Thomas";

     var arr2 = new Array(3);

     arr2[0] = "James";

     arr2[1] = "Adrew";

     arr2[2] = "Martin";

     document.write(arr.concat(arr2));

 </script>

 </body>

 </html>

　　　　效果：

五、JavaScript Boolean（逻辑）对象

　　Boolean（逻辑）对象用于将非逻辑值转换为逻辑值（true 或者 false）。

1、使用关键词 new 来定义 Boolean 对象

var myBoolean=new Boolean()

注释：如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN，那么对象的值为 false。否则，其值为 true（即使当自变量为字符串 "false" 时）！

2、Boolean 对象属性

3、Boolean 对象方法

六、JavaScript Math（算数）对象

　　Math（算数）对象的作用是：执行常见的算数任务。Math 对象并不像 Date 和 String 那样是对象的类，因此没有构造函数 Math()，像 Math.sin()
这样的函数只是函数，不是某个对象的方法。您无需创建它，通过把 Math 作为对象使用就可以调用其所有属性和方法。

1、算数值

JavaScript 提供 8 种可被 Math 对象访问的算数值：

常数
圆周率
2 的平方根
1/2 的平方根
2 的自然对数
10 的自然对数
以 2 为底的 e 的对数
以 10 为底的 e 的对数

这是在 Javascript 中使用这些值的方法：（与上面的算数值一一对应）

Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E

2、Math 对象方法

3、eg：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>js</title>

 </head>

 <body>

 <script type="text/javascript">

     document.write(Math.round(0.6)+ "<br />");   //把数四舍五入为最接近的整数

     document.write(Math.random()+ "<br />")     //返回0~1之间的随机数

     document.write(Math.max(5,7) + "<br />")    //返回两个数之间较大的数

 </script>

 </body>

 </html>

效果：刷新一下：

七、JavaScript RegExp 对象

　　RegExp 对象用于规定在文本中检索的内容。它是对字符串执行模式匹配的强大工具。

1、什么是 RegExp？

　　RegExp 是正则表达式的缩写。当您检索某个文本时，可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。简单的模式可以是一个单独的字符。更复杂的模式包括了更多的字符，并可用于解析、格式检查、替换等等。您可以规定字符串中的检索位置，以及要检索的字符类型，等等

2、定义 RegExp

　　RegExp 对象用于存储检索模式。通过 new 关键词来定义 RegExp 对象。以下代码定义了名为 patt1 的 RegExp 对象，其模式是 "e"：

var patt1=new RegExp("e");

当您使用该 RegExp 对象在一个字符串中检索时，将寻找的是字符 "e"。

3、RegExp 对象方法

eg：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JavaScript</title>

 </head>

 <script type="text/javascript">

     var patt1=new RegExp("e");

     document.write(patt1.test("The best things in life are free")+"<br>");

     document.write(patt1.exec("The best things in life are free")+"<br>");

     document.write(patt1.test("The best things in life are free")+"<br>");

     patt1.compile("d");   //compile() 既可以改变检索模式，也可以添加或删除第二个参数。这里改变检索模式，搜索的是d

     document.write(patt1.test("The best things in life are free")+"<br>");

 </script>

 <body>

 </body>

 </html>

　　　　效果：

　　**可以向 RegExp 对象添加第二个参数，以设定检索。例如，如果需要找到所有某个字符的所有存在，则可以使用 "g" 参数 ("global")。在使用 "g" 参数时，exec() 的工作原理如下：

找到第一个 "e"，并存储其位置
如果再次运行 exec()，则从存储的位置开始检索，并找到下一个 "e"，并存储其位置

eg：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>js</title>

 </head>

 <body>

 <script type="text/javascript">

     var patt1=new RegExp("e","g");

     do {

         result=patt1.exec("The best things in life are free");

         document.write(result);

     }

     while (result!=null)

 </script>

 </body>

 </html>

　　效果：

JavaScript学习之对象的更多相关文章

JavaScript学习04 对象
JavaScript学习04 对象默认对象日期对象Date, 格式:日期对象名称=new Date([日期参数]) 日期参数: 1.省略(最常用): 2.英文-数值格式:月日,公元年 [时:分: ...
Javascript学习4 - 对象和数组
原文:Javascript学习4 - 对象和数组在Javascript中,对象和数组是两种基本的数据类型,而且它们也是最重要的两种数据类型. 对象是已命名的值的一个集合,而数组是一种特殊对象,它就像 ...
JavaScript学习笔记——对象知识点
javascript对象的遍历.内存分布和封装特性一.javascript对象遍历 1.javascript属性访问对象.属性对象[属性] //字符串格式 //javascript属性的访问方法 ...
JavaScript学习笔记-对象
枚举对象的属性:通常用for(...in...)来循环遍历,由于 for in 总是要遍历整个原型链,因此如果一个对象的继承层次太深的话会影响性能 for(var i in foo){ if(foo. ...
JavaScript学习笔记——对象分类
对象的分类一.对象的分类 1.内置对象 Global Math 2.本地对象 Array Number String Boolean Function RegExp 3.宿主对象 DOM BOM 二 ...
JavaScript学习笔记——对象基础
javascript对象基础一.名词解释: 1.基于对象一切皆对象,以对象的概念来编程. 2.面向对象编程(oop Object oriented programming) A.对象就是人们要研 ...
JavaScript学习笔记——对象的创建
对象是JavaScript基本数据类型,在JavaScript中除了Undefined.Null.布尔型(ture.false).字符串和数字之外,其他的都属于对象. 在JavaScript中,一个对 ...
JavaScript学习——JS对象和全局函数
1. Array对象数组的特点:长度可变!数组的长度=最大角标+1 2.Boolean对象如果value 不写,那么默认创建的结果为false 3.Date对象 getTime()返回1970年1 ...
JavaScript学习——BOM对象
1.BOM 对象:浏览器对象模型(操作与浏览器相关的内容) 2.Window 对象 Window 对象表示浏览器中打开的窗口 setInterval():它有一个返回值,主要是提供给 clearInt ...

随机推荐

codevs 1507酒厂选址
#include<cstdio> #include<cstdlib> using namespace std; int n; int dis[10010],a[10010],x ...
不通过App Store，在iOS设备上直接安装应用程序(转)
今天在iOS设备上安装天翼云存储app,在safari上直接打开http://cloud.189.cn/wap/index.jsp,点击“点击免费安装”,如下图: 神奇的事情发生了,设备上直接下载ap ...
【BZOJ】2038: [2009国家集训队]小Z的袜子(hose)（组合计数+概率+莫队算法+分块）
http://www.lydsy.com/JudgeOnline/problem.php?id=2038 学了下莫队,挺神的orzzzz 首先推公式的话很简单吧... 看的题解是从http://for ...
如何用JavaScript在页面上显示一个时间钟表
<html><head><script type="text/javascript">function myTime(){var today=n ...
AngularJS系列：表单全解（表单验证，radio必选，三级联动，check绑定，form提交验证）
一.查看$scope -->寻找Form控制变量的位置 Form控制变量格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...
jQuery系列：N种方法大总结
jquery自定义属性,区分prop()和attr() jQueryObject.prop( propertyName [, value ] ):为添加,获取属性(property),并非attrib ...
CodeForces 577B 模和vecto
上一年的最后一次训练赛被卡了AK... 一开始天真的认为每个数字都进行取模然后认为它是一个vol为取模后的数 val为0的01背包去计算dp[m]能否被装满只想到了其中的一点..简直天真后来看 ...
mobile cpu上禁用alpha test的相关总结
因为,每家芯片的特性不同,根据向framebuffer写法的不同,分为tile-based的mobile cpu,如ImgTec PowerVR,ARM Mali,一部分老版本Qualcomm ...
JNDI学习总结(一)——JNDI数据源的配置
一.数据源的由来在Java开发中,使用JDBC操作数据库的四个步骤如下: ①加载数据库驱动程序(Class.forName("数据库驱动类");) ②连接数据库(Connec ...
razor 添加html5属性
在 HTML5 中, 可以使用 data- 属性来表示用户数据,这些数据甚至可以是 JSON 格式的数据,对 Web 前端开发带来很大的方便. 在 MVC 的 Razor 中,可以使用匿名对象来生成定 ...

JavaScript学习之对象

JavaScript对象

JavaScript学习之对象的更多相关文章

随机推荐

热门专题