JavaScript의 개체 속성, 메서드, 사용자 정의 개체 정의 및 사용법에 대한 자세한 설명-JS 튜토리얼-php.cn

JavaScript의 개체 속성, 메서드, 사용자 정의 개체 정의 및 사용법에 대한 자세한 설명

伊谢尔伦

풀어 주다： 2018-05-16 14:08:20

원래의

4659명이 탐색했습니다.

객체는 속성으로 구성됩니다. 속성에 함수가 포함되어 있으면 객체의 메서드로 간주되고, 그렇지 않으면 속성으로 간주됩니다.

객체 속성:

객체의 속성은 세 가지 기본 데이터 유형 또는 다른 객체와 같은 추상 데이터 유형일 수 있습니다. 개체 속성은 일반적으로 개체의 메서드에서 내부적으로 사용되는 변수이지만 전역적으로 사용되며 페이지 전체에서 표시되는 변수일 수도 있습니다.

속성을 추가하는 목적 구문은 다음과 같습니다.

objectName.objectProperty = propertyValue;

로그인 후 복사

예:

다음은 파일 개체의 "제목" 속성을 사용하여 문서 제목을 가져오는 방법을 설명하는 간단한 예입니다.

var str = document.title;

로그인 후 복사

개체의 방법 :

방법은 대상에게 뭔가를 하라고 요청하는 것입니다. 함수 명령문이 독립적인 단위이고 메서드가 객체에 연결되어 이 키워드를 통해 참조할 수 있다는 점을 제외하면 함수와 메서드 사이에는 거의 차이가 없습니다.

메서드는 개체의 화면 내용을 표시하는 것부터 로컬 속성 및 매개 변수 집합에 대한 복잡한 수학적 연산을 수행하는 것까지 모든 것에 유용할 수 있습니다.
예:

다음은 문서 개체의 write() 메서드를 사용하여 문서에 무엇이든 쓰는 방법을 보여주는 간단한 예입니다.

document.write("This is test");

로그인 후 복사

사용자 정의 개체:

모든 사용자 정의 개체 및 내장- 객체에서 객체의 자손을 객체라고 합니다.
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 키워드를 사용하여 정의되지 않습니다.
예제 1:

이 예는 객체를 생성하는 방법을 보여줍니다.

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

로그인 후 복사

예제 2:

이 예는 사용자 정의 함수인 객체를 생성하는 방법을 보여줍니다. 여기서 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>

로그인 후 복사

메서드가 정의된 객체:

이전 예제에서는 생성자가 객체를 생성하고 속성을 할당하는 방법을 보여주었습니다. 그러나 객체 정의를 완료하려면 할당 방법을 사용해야 합니다.
예:

다음은 개체에 함수를 추가하는 방법을 보여주는 간단한 예입니다.

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

로그인 후 복사

with 키워드:

with 키워드는 개체의 속성이나 메서드를 참조하는 약어 역할을 합니다.

파라미터로 지정된 객체는 다음 블록이 지속되는 동안 기본 객체가 됩니다. 개체의 속성과 메서드는 명명되지 않은 개체에서 찾을 수 있습니다.
문법

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>

로그인 후 복사

위 내용은 JavaScript의 개체 속성, 메서드, 사용자 정의 개체 정의 및 사용법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!