Web开发技术——Javascript对象1(数值,字符串,日期)

JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...

此外,JavaScript 允许自定义对象。

JavaScript 对象

JavaScript 提供多个内建对象,比如 String、Date、Array 等等。

对象只是带有属性方法的特殊数据类型。

访问对象的属性

属性是与对象相关的值。

访问对象属性的语法是:

objectName.propertyName

这个例子使用了 String 对象的 length 属性来获得字符串的长度:

var message="Hello World!";
var x=message.length;

在以上代码执行后,x 的值将是:

12

访问对象的方法

方法是能够在对象上执行的动作。

您可以通过以下语法来调用方法:

objectName.methodName()

这个例子使用了 String 对象的 toUpperCase() 方法来将文本转换为大写:

var message="Hello world!";
var x=message.toUpperCase();

在以上代码执行后,x 的值将是:

HELLO WORLD!

创建 JavaScript 对象

通过 JavaScript,您能够定义并创建自己的对象。

创建新对象有两种不同的方法:

1. 定义并创建对象的实例

2. 使用函数来定义对象,然后创建新的对象实例

创建直接的实例

这个例子创建了对象的一个新实例,并向其添加了四个属性:

实例
person=new Object();person.firstname="Bill";person.lastname="Gates";person.age=56;person.eyecolor="blue";替代语法(使用对象 literals):

实例
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
实例
person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";

替代语法(使用对象 literals):

实例
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};

使用对象构造器

本例使用函数来构造对象:

实例
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

 

创建 JavaScript 对象实例

一旦您有了对象构造器,就可以创建新的对象实例,就像这样:

var myFather=new person("Bill","Gates",56,"blue");
var myMother=new person("Steve","Jobs",48,"green");

把属性添加到 JavaScript 对象

您可以通过为对象赋值,向已有对象添加新属性:

假设 personObj 已存在 - 您可以为其添加这些新属性:firstname、lastname、age 以及 eyecolor:

person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";
 
x=person.firstname;

在以上代码执行后,x 的值将是:

Bill

把方法添加到 JavaScript 对象

方法只不过是附加在对象上的函数。

在构造器函数内部定义对象的方法:

function person(firstname,lastname,age,eyecolor){
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
    this.changeName=changeName;
    function changeName(name){this.lastname=name;}
}

changeName() 函数 name 的值赋给 person 的 lastname 属性。

现在您可以试一下:

myMother.changeName("Ballmer");

JavaScript 类

JavaScript 是面向对象的语言,但 JavaScript 不使用类。

在 JavaScript 中,不会创建类,也不会通过类来创建对象(就像在其他面向对象的语言中那样)。

JavaScript 基于 prototype,而不是基于类的。

JavaScript for...in 循环

JavaScript for...in 语句循环遍历对象的属性。

语法
for (对象中的变量)
  {
  要执行的代码
  }

注释:for...in 循环中的代码块将针对每个属性执行一次。

实例

循环遍历对象的属性:

var person={fname:"Bill",lname:"Gates",age:56};
 
for (x in person)
  {
  txt=txt + person[x];
  }

JavaScript Number 对象

· JS 对象

· JS 字符串

JavaScript 只有一种数字类型。

可以使用也可以不使用小数点来书写数字。

JavaScript 数字

JavaScript 数字可以使用也可以不使用小数点来书写:

实例
var pi=3.14;    // 使用小数点
var x=34;       // 不使用小数点

极大或极小的数字可通过科学(指数)计数法来写:

实例
var y=123e5;    // 12300000
var z=123e-5;   // 0.00123

所有 JavaScript 数字均为 64 位

JavaScript 不是类型语言。与许多其他编程语言不同,JavaScript 不定义不同类型的数字,比如整数、短、长、浮点等等。

JavaScript 中的所有数字都存储为根为 10 的 64 位(8 比特),浮点数。

精度

整数(不使用小数点或指数计数法)最多为 15 位。

小数的最大位数是 17,但是浮点运算并不总是 100% 准确:

实例
var x=0.2+0.1;

八进制和十六进制

如果前缀为 0,则 JavaScript 会把数值常量解释为八进制数,如果前缀为 0 和 "x",则解释为十六进制数。

实例
var y=0377;
var z=0xFF;

提示:绝不要在数字前面写零,除非您需要进行八进制转换。

数字属性和方法

属性:

· MAX VALUE

· MIN VALUE

· NEGATIVE INFINITIVE

· POSITIVE INFINITIVE

· NaN

· prototype

· constructor

方法:

· toExponential()

· toFixed()

· toPrecision()

· toString()

· valueOf()

完整的 Number 对象参考手册

如需可用于 Number 对象的所有属性和方法的完整参考,请访问我们的 Number 对象参考手册

该参考手册包含每个属性和方法的描述和实例。

3 JavaScript 字符串(String)对象

· JS 数字

· JS 日期

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

JavaScript String(字符串)对象 实例

计算字符串的长度

如何使用长度属性来计算字符串的长度。

为字符串添加样式

如何为字符串添加样式。

indexOf() 方法

如何使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置。

match() 方法

如何使用 match() 来查找字符串中特定的字符,并且如果找到的话,则返回这个字符。

如何替换字符串中的字符 - replace()

如何使用 replace() 方法在字符串中用某些字符替换另一些字符。

字符串对象

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

例子:

下面的例子使用字符串对象的长度属性来计算字符串的长度。

var txt="Hello world!"
document.write(txt.length)

上面的代码输出为:

12

下面的例子使用字符串对象的toUpperCase()方法将字符串转换为大写:

var txt="Hello world!"
document.write(txt.toUpperCase())

上面的代码输出为:

HELLO WORLD!

3 JavaScript Date(日期)对象

· JS 字符串

· JS 数组

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

JavaScript Date(日期)对象 实例

返回当日的日期和时间

如何使用 Date() 方法获得当日的日期。

getTime()

getTime() 返回从 1970 年 1 月 1 日至今的毫秒数。

setFullYear()

如何使用 setFullYear() 设置具体的日期。

toUTCString()

如何使用 toUTCString() 将当日的日期(根据 UTC)转换为字符串。

getDay()

如何使用 getDay() 和数组来显示星期,而不仅仅是数字。

显示一个钟表

如何在网页上显示一个钟表。

完整的 Date 对象参考手册

我们提供 JavaScript Date 对象参考手册,其中包括所有可用于日期对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

定义日期

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

可以通过 new 关键词来定义 Date 对象。以下代码定义了名为 myDate 的 Date 对象:

var myDate=new Date()

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

操作日期

通过使用针对日期对象的方法,我们可以很容易地对日期进行操作。

在下面的例子中,我们为日期对象设置了一个特定的日期 (2008 年 8 月 9 日):

var myDate=new Date()

myDate.setFullYear(2008,7,9)

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

在下面的例子中,我们将日期对象设置为 5 天后的日期:

var myDate=new Date()

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

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

比较日期

日期对象也可用于比较两个日期。

下面的代码将当前日期与 2008 年 8 月 9 日做了比较:

var myDate=new Date();
myDate.setFullYear(2008,8,9);
var today = new Date();
if (myDate>today)

{
    alert("Today is before 9th August 2008");
}
else

{
    alert("Today is after 9th August 2008");
}
时间: 2024-08-26 11:57:33

Web开发技术——Javascript对象1(数值,字符串,日期)的相关文章

Web开发技术 ——JavaScript语法2(变量、数据类型、对象)

JavaScript 变量 变量是存储信息的容器. 实例 var x=2; var y=3; var z=x+y; 就像代数那样 x=2 y=3 z=x+y 在代数中,我们使用字母(比如 x)来保存值(比如 2). 通过上面的表达式 z=x+y,我们能够计算出 z 的值为 5. 在 JavaScript 中,这些字母被称为变量. 提示:您可以把变量看做存储数据的容器. JavaScript 变量 与代数一样,JavaScript 变量可用于存放值(比如 x=2)和表达式(比如 z=x+y). 变

Web开发技术——Javascript Window BOM

JavaScript Window - 浏览器对象模型 浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器"对话". 浏览器对象模型 (BOM) 浏览器对象模型(Browser Object Model)尚无正式标准. 由于现代浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性,因此常被认为是 BOM 的方法和属性. Window 对象 所有浏览器都支持 window 对象.它表示浏览器窗口. 所有 JavaScript 全局对象.函数以及变量

Web开发技术——JavaScript语法1(操作HTML元素、注释)

JavaScript 通常用于操作 HTML 元素 操作 HTML 元素 如需从 JavaScript 访问某个 HTML 元素,您可以使用 document.getElementById(id) 方法. 请使用 "id" 属性来标识 HTML 元素: 例子 通过指定的 id 来访问 HTML 元素,并改变其内容: <!DOCTYPE html> <html> <body> <h1>My First Web Page</h1>

Web开发技术&mdash;&mdash;JavaScript HTML DOM1(基础、改变HTML、改变CSS)

JavaScript HTML DOM 通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素. HTML DOM (文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model). HTML DOM 模型被构造为对象的树. HTML DOM 树 通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML. · JavaScript 能够改变页面中的所有 HTML 元素 · JavaScript 能够改

Web开发技术&mdash;&mdash;JavaScript语法4(分支语句、循环语句)

JavaScript If...Else 语句 条件语句用于基于不同的条件来执行不同的动作. 条件语句 通常在写代码时,您总是需要为不同的决定来执行不同的动作.您可以在代码中使用条件语句来完成该任务. 在 JavaScript 中,我们可使用以下条件语句: · if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码 · if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码 · if...else if....else 语句 - 使用该语

Web开发技术&mdash;&mdash;Javascript基础

什么是JavaScript JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编程代码. JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行. Javascript主要用来修改HTML和CSS,使网页产生动态的效果 如何使用Javascript HTML 中的脚本必须位于 <script> 与 </script> 标签之间. 脚本可被放置在 HTML 页面的 <body> 和 <head> 部

Web开发技术&mdash;&mdash;JavaScript语法3(函数、运算符、比较和逻辑运算符)

JavaScript 函数 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. 实例 <!DOCTYPE html> <html> <head> <script>function myFunction() { alert("Hello World!"); }</script> </head> <body> <button onclick="myFunction()"&

Web开发技术&mdash;&mdash;Javascript HTML DOM2(事件)

JavaScript HTML DOM 事件 HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应. 对事件做出反应 我们可以在事件发生时执行 JavaScript,比如当用户在 HTML 元素上点击时. 如需在用户点击某个元素时执行代码,请向一个 HTML 事件属性添加 JavaScript 代码: onclick=JavaScript HTML 事件的例子: · 当用户点击鼠标时 · 当网页已加载时 · 当图像已加载时 · 当鼠标移动到元素上时 · 当输入字段被改变时

Web开发技术&mdash;&mdash;JavaScript HTML DOM3 (元素)

添加和删除节点(HTML 元素). 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素. 实例 <div id="div1"> <p id="p1">这是一个段落</p> <p id="p2">这是另一个段落</p> </div> <script> var para=document.