`
izuoyan
  • 浏览: 9217956 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

JavaScripte最经典和权威的教程(对象介绍)

阅读更多
摘自http://www.w3schools.com/js/js_obj_intro.asp

JavaScript Objects Introduction

JavaScript is an Object Oriented Programming (OOP) language.

An OOP language allows you to define your own objects and make your own variable types.


Object Oriented Programming

JavaScript is an Object Oriented Programming (OOP) language. An OOP language allows you to define your own objects and make your own variable types.

However, creating your own objects will be explained later, in the Advanced JavaScript section. We will start by looking at the built-in JavaScript objects, and how they are used. The next pages will explain each built-in JavaScript object in detail.

Note that an object is just a special kind of data. An object has properties and methods.


Properties

Properties are the values associated with an object.

In the following example we are using the length property of the String object to return the number of characters in a string:

<script type="text/javascript">
var txt="Hello World!"
document.write(txt.length)
</script>

The output of the code above will be:

12


Methods

Methods are the actions that can be performed on objects.

In the following example we are using the toUpperCase() method of the String object to display a text in uppercase letters:

<script type="text/javascript">
var str="Hello world!"
document.write(str.toUpperCase())
</script>

The output of the code above will be:

HELLO WORLD!

JavaScript String Object


The String object is used to manipulate a stored piece of text.


Examples

Return the length of a string
How to use the length property to find the length of a string.

Style strings
How to style strings.

The indexOf() method
How to use the indexOf() method to return the position of the first occurrence of a specified string value in a string.

The match() method
How to use the match() method to search for a specified string value within a string and return the string value if found

Replace characters in a string - replace()
How to use the replace() method to replace some characters with some other characters in a string.


Complete String Object Reference

For a complete reference of all the properties and methods that can be used with the String object, go to our complete String object reference.

The reference contains a brief description and examples of use for each property and method!


String object

The String object is used to manipulate a stored piece of text.

Examples of use:

The following example uses the length property of the String object to find the length of a string:

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

The code above will result in the following output:

12

The following example uses the toUpperCase() method of the String object to convert a string to uppercase letters:

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

The code above will result in the following output:

HELLO WORLD!

JavaScript Date Object

The Date object is used to work with dates and times.


Examples

Return today's date and time
How to use the Date() method to get today's date.

getTime()
Use getTime() to calculate the years since 1970.

setFullYear()
How to use setFullYear() to set a specific date.

toUTCString()
How to use toUTCString() to convert today's date (according to UTC) to a string.

getDay()
Use getDay() and an array to write a weekday, and not just a number.

Display a clock
How to display a clock on your web page.


Complete Date Object Reference

For a complete reference of all the properties and methods that can be used with the Date object, go to our complete Date object reference.

The reference contains a brief description and examples of use for each property and method!


Defining Dates

The Date object is used to work with dates and times.

We define a Date object with the new keyword. The following code line defines a Date object called myDate:

var myDate=new Date()

Note: The Date object will automatically hold the current date and time as its initial value!


Manipulate Dates

We can easily manipulate the date by using the methods available for the Date object.

In the example below we set a Date object to a specific date (14th January 2010):

var myDate=new Date()
myDate.setFullYear(2010,0,14)

And in the following example we set a Date object to be 5 days into the future:

var myDate=new Date()
myDate.setDate(myDate.getDate()+5)

Note: If adding five days to a date shifts the month or year, the changes are handled automatically by the Date object itself!


Comparing Dates

The Date object is also used to compare two dates.

The following example compares today's date with the 14th January 2010:

var myDate=new Date()
myDate.setFullYear(2010,0,14)
var today = new Date()
if (myDate>today)
alert("Today is before 14th January 2010")
else
alert("Today is after 14th January 2010")

JavaScript Array Object

The Array object is used to store a set of values in a single variable name.


Examples

Create an array
Create an array, assign values to it, and write the values to the output.

For...In Statement
How to use a for...in statement to loop through the elements of an array.

Join two arrays - concat()
How to use the concat() method to join two arrays.

Put array elements into a string - join()
How to use the join() method to put all the elements of an array into a string.

Literal array - sort()
How to use the sort() method to sort a literal array.

Numeric array - sort()
How to use the sort() method to sort a numeric array.


Complete Array Object Reference

For a complete reference of all the properties and methods that can be used with the Array object, go to our complete Array object reference.

The reference contains a brief description and examples of use for each property and method!


Defining Arrays

The Array object is used to store a set of values in a single variable name.

We define an Array object with the new keyword. The following code line defines an Array object called myArray:

var myArray=new Array()

There are two ways of adding values to an array (you can add as many values as you need to define as many variables you require).

1:

var mycars=new Array()
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

You could also pass an integer argument to control the array's size:

var mycars=new Array(3)
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

2:

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

Note: If you specify numbers or true/false values inside the array then the type of variables will be numeric or Boolean instead of string.


Accessing Arrays

You can refer to a particular element in an array by referring to the name of the array and the index number. The index number starts at 0.

The following code line:

document.write(mycars[0])

will result in the following output:

Saab


Modify Values in Existing Arrays

To modify a value in an existing array, just add a new value to the array with a specified index number:

mycars[0]="Opel"

Now, the following code line:

document.write(mycars[0])

will result in the following output:

Opel

JavaScript Boolean Object

The Boolean object is used to convert a non-Boolean value to a Boolean value (true or false).


Examples

Check Boolean value
Check if a Boolean object is true or false.


Complete Boolean Object Reference

For a complete reference of all the properties and methods that can be used with the Boolean object, go to our complete Boolean object reference.

The reference contains a brief description and examples of use for each property and method!


Boolean Object

The Boolean object is an object wrapper for a Boolean value.

The Boolean object is used to convert a non-Boolean value to a Boolean value (true or false).

We define a Boolean object with the new keyword. The following code line defines a Boolean object called myBoolean:

var myBoolean=new Boolean()

Note: If the Boolean object has no initial value or if it is 0, -0, null, "", false, undefined, or NaN, the object is set to false. Otherwise it is true (even with the string "false")!

All the following lines of code create Boolean objects with an initial value of false:

var myBoolean=new Boolean()
var myBoolean=new Boolean(0)
var myBoolean=new Boolean(null)
var myBoolean=new Boolean("")
var myBoolean=new Boolean(false)
var myBoolean=new Boolean(NaN)

And all the following lines of code create Boolean objects with an initial value of true:

var myBoolean=new Boolean(true)
var myBoolean=new Boolean("true")
var myBoolean=new Boolean("false")
var myBoolean=new Boolean("Richard")

JavaScript Math Object

The Math object allows you to perform common mathematical tasks.


Examples

round()
How to use round().

random()
How to use random() to return a random number between 0 and 1.

max()
How to use max() to return the number with the highest value of two specified numbers.

min()
How to use min() to return the number with the lowest value of two specified numbers.


Complete Math Object Reference

For a complete reference of all the properties and methods that can be used with the Math object, go to our complete Math object reference.

The reference contains a brief description and examples of use for each property and method!


Math Object

The Math object allows you to perform common mathematical tasks.

The Math object includes several mathematical values and functions. You do not need to define the Math object before using it.


Mathematical Values

JavaScript provides eight mathematical values (constants) that can be accessed from the Math object. These are: E, PI, square root of 2, square root of 1/2, natural log of 2, natural log of 10, base-2 log of E, and base-10 log of E.

You may reference these values from your JavaScript like this:

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


Mathematical Methods

In addition to the mathematical values that can be accessed from the Math object there are also several functions (methods) available.

Examples of functions (methods):

The following example uses the round() method of the Math object to round a number to the nearest integer:

document.write(Math.round(4.7))

The code above will result in the following output:

5

The following example uses the random() method of the Math object to return a random number between 0 and 1:

document.write(Math.random())

The code above can result in the following output:

	document.write(Math.random())
	0.5300708076970763

The following example uses the floor() and random() methods of the Math object to return a random number between 0 and 10:

document.write(Math.floor(Math.random()*11))

The code above can result in the following output:

	document.write(Math.floor(Math.random()*11))
	5

JavaScript HTML DOM Objects

In addition to the built-in JavaScript objects, you can also access and manipulate all of the HTML DOM objects with JavaScript.


More JavaScript Objects

Follow the links to learn more about the objects and their collections, properties, methods and events.

Object Description
Window The top level object in the JavaScript hierarchy. The Window object represents a browser window. A Window object is created automatically with every instance of a <body> or <frameset> tag
Navigator Contains information about the client's browser
Screen Contains information about the client's display screen
History Contains the visited URLs in the browser window
Location Contains information about the current URL


The HTML DOM

The HTML DOM is a W3C standard and it is an abbreviation for the Document Object Model for HTML.

The HTML DOM defines a standard set of objects for HTML, and a standard way to access and manipulate HTML documents.

All HTML elements, along with their containing text and attributes, can be accessed through the DOM. The contents can be modified or deleted, and new elements can be created.

The HTML DOM is platform and language independent. It can be used by any programming language like Java, JavaScript, and VBScript.

Follow the links below to learn more about how to access and manipulate each DOM object with JavaScript:

Object Description
Document Represents the entire HTML document and can be used to access all elements in a page
Anchor Represents an <a> element
Area Represents an <area> element inside an image-map
Base Represents a <base> element
Body Represents the <body> element
Button Represents a <button> element
Event Represents the state of an event
Form Represents a <form> element
Frame Represents a <frame> element
Frameset Represents a <frameset> element
Iframe Represents an <iframe> element
Image Represents an <img> element
Input button Represents a button in an HTML form
Input checkbox Represents a checkbox in an HTML form
Input file Represents a fileupload in an HTML form
Input hidden Represents a hidden field in an HTML form
Input password Represents a password field in an HTML form
Input radio Represents a radio button in an HTML form
Input reset Represents a reset button in an HTML form
Input submit Represents a submit button in an HTML form
Input text Represents a text-input field in an HTML form
Link Represents a <link> element
Meta Represents a <meta> element
Option Represents an <option> element
Select Represents a selection list in an HTML form
Style Represents an individual style statement
Table Represents a <table> element
TableData Represents a <td> element
TableRow Represents a <tr> element
Textarea Represents a <textarea> element
分享到:
评论

相关推荐

    Javascript高级教程

    JavaScript,也被称为JS,是一种广泛应用于网页和网络应用的编程...通过阅读"阅读器下载.htm"和"E书说明.txt",你将了解如何获取和使用这个教程,而"Javascript 高级教程"很可能是教程的主文件,包含详细的章节和实例。

    W3C JavaScript 高级教程

    本教程“W3C JavaScript 高级教程”旨在深入探讨JavaScript的核心概念和技术,帮助开发者提升他们的编程技能。 JavaScript的主要功能是在用户的浏览器端运行,实现动态交互,如表单验证、页面动画、AJAX异步通信...

    e语言-JavaScript教程

    资源介绍:这些方便实用的信息将帮助您了解 JScript 的各个部分。在“字母顺序的关键字列表”中,可以找到按字母顺序列出的所有 JScript 语言的主题。如果只需要查看某个主题(例如对象),则有对该主题进行详细说明...

    javaScripte光盘项目03

    这个"javaScripte光盘项目03"很可能是某个学习资源或教程的一部分,包含了一系列的源代码文件,用于帮助程序员深入理解和实践JavaScript编程。下面我们将深入探讨这些标签和文件名可能代表的JavaScript知识点。 ...

    JavaScript实例教程

    此"JavaScript实例教程"显然旨在帮助初学者和有经验的开发者通过实践来深入理解和掌握这种强大的语言。 在JavaScript中,实例化通常是学习过程中的一个重要环节。实例教程可能涵盖了如何创建并使用对象,因为对象是...

    javascript学习教程和jquery帮助文档及api

    2. **对象与原型**:JavaScript中的对象是属性和方法的集合,原型是JavaScript继承的基础,理解原型链对于深入理解JavaScript至关重要。 3. **DOM操作**:Document Object Model(DOM)是HTML和XML文档的结构表示,...

    JavaScript经典之作

    《JavaScript经典之作》是一本全面介绍JavaScript编程语言的经典教程。它不仅涵盖了基础知识,还深入探讨了许多高级主题,是学习JavaScript的理想选择。通过本书的学习,读者能够建立起坚实的JavaScript基础,并逐步...

    Javascript之Number对象介绍

    在介绍JavaScript编程语言中,Number对象是其中的一个重要组成部分,它不仅包含了基本的数字类型,还封装了一整套用于处理数字的方法和属性。本文将针对Number对象的用途、属性、以及各种方法进行详细介绍,旨在为...

    JavaScript核心编程教程

    ### JavaScript核心编程教程知识点概述 本教程主要针对Web前端开发中的JavaScript基础知识进行...以上内容是《JavaScript核心编程教程》的主要知识点总结,希望能帮助读者更好地理解和掌握JavaScript的基本操作技巧。

    独立团E语言教程基础篇

    5. **5-1-1 API安装**:这部分可能是关于API(应用程序接口)的介绍和使用指南,包括如何调用外部服务或库的功能。 6. **6-1-1 游戏框架**:最后这部分可能讲解了如何使用E语言构建游戏框架,包括架构设计、模块划分...

    javascript 应用案例ppt教程

    ### JavaScript应用案例PPT教程知识点总结 #### 一、表单校验基础知识 - **val() 方法**: 用于获取或设置表单控件(如 input, textarea, select 等)的值。 - **attr() 方法**: 用于获取或设置 HTML 元素的属性值...

    JavaScript完全教程

    ### JavaScript完全教程知识点详解 #### 一、一般资料与语法基础 **1. 文稿格式** JavaScript 是一种脚本语言,通常嵌入 HTML 文件中,用于网页动态效果的实现。其代码格式需遵循一定的规范。 **2. 在 HTML 网页...

    JavaScript入门教程(12) js对象化编程

    通过构造函数和`new`关键字,JavaScript为我们提供了强大的对象创建和初始化能力。这使得我们能够像操作普通对象一样,管理由构造函数创建的实例的属性和方法。 #### 总结 JavaScript对象化编程是构建动态网页的...

    javascript语言参考+教程 CHM

    FileSystemObject 和 Scripting 运行时库参考的介绍; FileSystemObject 对象; 设计 FileSystemObject; 处理驱动器和文件夹; 处理文件; FileSystemObject 示例代码; Scripting 运行时库参考; 脚本运行时方法; ...

    javascript5(e)

    这个压缩包文件"javascript5(e)"很可能包含的是关于JavaScript5的英文版教材或教程,以及配套的源代码示例。 JavaScript是一种轻量级的解释型编程语言,主要用于网页和网络应用开发。它在浏览器端运行,赋予了网页...

    JavaScript网页开发实战

    接着,书中会深入讲解JavaScript的面向对象特性,包括对象的创建、原型链、构造函数和类。理解这些概念对于构建复杂的网页应用至关重要。此外,还将涉及作用域和闭包,这是JavaScript中两个非常重要的概念,它们决定...

    计算机\教程\asp.net和C#\原版教程\ASP.NET中的对象.pdf

    根据给定的文件信息,我们将深入探讨ASP.NET中的一些核心对象和它们的功能,这包括Page对象、Response对象以及Request对象。这些对象在ASP.NET应用程序中扮演着关键角色,理解它们的特性和方法对于开发动态网页至关...

Global site tag (gtag.js) - Google Analytics