Detailed explanation of object properties, methods, user-defined object definitions and usage in JavaScript-JS Tutorial-php.cn

Detailed explanation of object properties, methods, user-defined object definitions and usage in JavaScript

伊谢尔伦

Release： 2018-05-16 14:08:20

Original

4671 people have browsed it

Objects are composed of properties. If a property contains a function, it is considered a method of an object, otherwise, the property is considered a property.

Object properties:

The properties of an object can be of any of the three basic data types, or any abstract data type, such as another object. Object properties are usually variables used internally by methods of the object, but can also be variables used globally and visible throughout the page.

The purpose syntax for adding attributes is:

objectName.objectProperty = propertyValue;

Copy after login

Example:

The following is a simple example to illustrate how to use the "title" attribute of the file object to obtain Document title:

var str = document.title;

Copy after login

Methods of objects:

Methods let objects do something. There is little difference between a function and a method, except that a function statement is an independent unit and the method is attached to the object and can be referenced through this keyword.

Methods can be useful for everything from displaying an object's on-screen content to performing complex mathematical operations on a set of local properties and parameters.
Example:

Here is a simple example to illustrate how to use the write() method of the document object to write any content in the document:

document.write("This is test");

Copy after login

User-defined object :

All user-defined objects and built-in objects are called descendants of the object's objects.
new operator:

The new operator is used to create instances of objects. To create an object, the new operator is followed by the constructor method.

In the following example, the constructor methods Object(), Array(), and Date(). These constructors are built-in JavaScript functions.

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

Copy after login

Object() Constructor:

The constructor is a function used to create and initialize objects. JavaScript provides a special constructor called Object() to construct objects. The return value of the Object() construct is assigned to a variable.

The variable contains a reference to the new object. Properties assigned to this object are invariants and are not defined using the var keyword.
Example 1:

This example demonstrates how to create an 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>

Copy after login

Example 2:

This example demonstrates how to create an object, a user-defined function . Here the this keyword is used to refer to the object that has been passed to the function:

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

Copy after login

The object on which the method is defined:

The previous example demonstrates how the constructor creates an object and Assign attributes. However, we need to use the allocation method to complete the definition of an object.
Example:

Here is a simple example to illustrate how to add a function with an object:

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

Copy after login

with Keywords:

The with keyword is used as a shorthand to refer to the properties or methods of an object.

The object specified as a parameter becomes the default object for the duration of the following block. Properties and methods for objects can be found on unnamed objects.
Grammar

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

Copy after login

Example:

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

Copy after login

The above is the detailed content of Detailed explanation of object properties, methods, user-defined object definitions and usage in JavaScript. For more information, please follow other related articles on the PHP Chinese website!