>  기사  >  웹 프론트엔드  >  JavaScript로 객체 생성(3가지 방법)

JavaScript로 객체 생성(3가지 방법)

藏色散人
藏色散人원래의
2019-04-04 10:08:472468검색

구문 측면에서 JavaScript는 유연한 객체 지향 언어입니다. 이 글에서는 JavaScript에서 객체를 인스턴스화하는 다양한 방법을 소개합니다.

JavaScript는 클래스가 없는 언어이며 함수는 클래스를 시뮬레이션하는 방식으로 사용된다는 점에 유의하는 것이 중요합니다. (권장: "javascript tutorial")

함수를 클래스로 사용:

JavaScript에서 객체를 인스턴스화하는 가장 쉬운 방법 중 하나입니다. 우리는 고전적인 JavaScript 함수를 정의하고 new 키워드를 사용하여 함수의 객체를 생성합니다. 함수 속성과 메서드는 this 키워드를 사용하여 생성됩니다.

<script> 
    function copyClass(name, age) { 
        this.name = name; 
        this.age = age; 
        this.printInfo = function() { 
            console.log(this.name); 
            console.log(this.age); 
        } 
    } 
  
// 创建copyClass对象并初始化参数。
var obj = new copyClass("Vineet", 20); 
  
//调用copyClass的方法。
obj.printInfo(); 
</script>

출력:

Vineet
20

설명: OOP의 클래스에는 두 가지 주요 구성 요소, 일부 매개 변수 및 일부 멤버 함수가 있습니다. 이 메소드에서는 name과 age라는 두 개의 매개변수(이 키워드는 클래스의 이름과 age를 제공되는 매개변수의 이름과 age로 구별하는 데 사용됨)를 사용하여 클래스와 유사한 함수를 선언하고 printInfo 메소드를 사용합니다. 이 매개변수의 값을 인쇄합니다. 그런 다음 단순히 copyClass 객체 obj를 생성하고 초기화한 후 해당 메서드를 호출합니다.

객체 리터럴 사용:

리터럴은 객체를 정의하는 더 작고 간단한 방법입니다. 아래에서는 리터럴을 사용하여 이전 개체와 정확히 동일한 개체를 인스턴스화합니다.

<script> 
    var obj = { 
        name : "", 
        age : "", 
        printInfo : function() { 
            console.log(this.name); 
            console.log(this.age); 
        } 
    } 
  
// 初始化参数。
obj.name = "Vineet"; 
obj.age = 19; 
  
// 使用对象的方法。
obj.printInfo(); 
</script>

출력:

Vineet
20

설명: 이 방법은 이전 방법과 동일하게 작동하지만 매개변수(이름 및 나이)와 방법(printInfo)을 함수에 묶는 대신 객체 자체에 묶고 초기화합니다. 개체를 선택하고 해당 메서드를 사용하면 됩니다.

싱글턴 함수 사용:

세 번째 방법은 다른 두 가지 방법을 조합한 것입니다. 함수를 사용하여 싱글톤 객체를 정의할 수 있습니다.

<script> 
    var obj = new function() { 
        this.name = ""; 
        this.age = ""; 
        this.printInfo = function() { 
            console.log(this.name); 
            console.log(this.age); 
        }; 
    } 
  
obj.name = "Vineet"; 
obj.age = 20; 
  
obj.printInfo(); 
</script>

출력:

Vineet
20

설명: 이것은 처음 두 메서드의 조합입니다. 메서드와 매개 변수를 함수로 묶지만 별도의 함수를 선언하는 대신(메서드 1의 copyClass와 같이) 간단히 함수 구조를 사용하는 객체.

위 내용은 JavaScript로 객체 생성(3가지 방법)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.