이 글에서 다루는 주제는 매우 기초적이고 많은 사람들이 트릭이라고 생각하지만, JavaScript의 기본 지식을 포괄하는 주제입니다. 여기에는 객체 속성 캡슐화, 프로토타입, 생성자, 클로저 및 표현식의 즉각적인 실행 에 대한 지식이 포함됩니다.
공개 방법
공용 메서드는 외부에서 액세스하고 호출할 수 있는 메서드입니다.
// 在对象中 var Restaurant = { name: 'McDonald', // 公有方法 getName: function() { return this.name; } } // 在构造函数中 function Person(name, age) { this.name = name; this.age = age; // 公有方法 this.getName = function() { return this.name; } } // 在原型中 Person.prototype.getAge = function() { return this.age; }
개인 메서드 및 특권 메서드
우리가 정의하는 특권 메소드는 내부 프라이빗 속성과 프라이빗 메소드에 액세스할 수 있는 퍼블릭 메소드를 말하고, 프라이빗 메소드는 외부의 보이지 않고 접근할 수 없는 메소드를 의미하기 때문에 일반적으로 이 두 메소드를 함께 논의합니다.
객체를 정의하는 방법에는 일반적으로 두 가지가 있습니다. 하나는 객체 인스턴스화 또는 객체 표현식을 사용하는 것이고, 다른 하나는 생성자를 사용하는 것입니다. 마찬가지로 프라이빗 메서드와 권한 있는 메서드를 정의하는 형태도 방식이 다릅니다.
객체 내
여기서는 객체 표현식을 사용하여 객체를 생성하고 일부 속성과 메서드를 추가한 다음 정적 방식으로 직접 호출합니다. 객체의 개인 데이터는 익명 함수 즉시 실행 표현식(IIFE)에 배치됩니다. 즉, 이 함수는 호출되는 순간에만 존재하며 실행 후 즉시 소멸됩니다.
객체에 프라이빗 데이터를 생성하는 방식을 객체 모드(객체 생성 모드를 의미)에서 모듈 패턴이라고 합니다.
var yourObject = (function() { // 私有属性和方法 return { // 公有方法和属性 } }) ();
모듈 모드에서 반환된 객체 리터럴에는 노출할 수 있는 속성과 메서드만 포함됩니다.
var Restaurant = (function() { // 私有属性 var _total = 10; // 私有方法 var _buyFood = function() { _total--; }; var _getTotal = function() { return _total; } return { name: 'McDonald', getTotal: _getTotal, buy: _buyFood } }) (); Restaurant.buy(); console.log(Restaurant.name); // 'McDonald' console.log(Restaurant.getTotal()); // 9
클로저를 사용하여 내부 전용 변수를 간접적으로 사용하고 레스토랑 이름을 초기화한다는 점에 유의하세요.
생성자에서
위에서 소개한 모듈 패턴에서 프라이빗 메소드를 생성할 때 퍼블릭 메소드와 권한 있는 메소드 사이에는 본질적인 차이가 없습니다. 그 이유는 이 개념은 프라이빗 데이터를 생성하기 위해 생성자를 사용할 때 정의되기 때문입니다.
생성자에서 전용 속성과 메서드를 정의하면 클로저를 사용할 필요가 없고 호출 시 데이터를 초기화할 수 있어 편리합니다.
function Restaurant(name) { // 私有属性 var _total = 10; // 公有属性 this.name = name; // 私有方法 function _buyFood() { _total--; } // 特权方法 this.buy = function() { _buyFood(); } this.getTotal = function() { return _total; } } // 公有方法, 注意这里不能访问私有成员_total Restaurant.prototype.getName = function() { console.log(_total); // Uncaught ReferenceError: _total is not defined return this.name; } var McDonald = new Restaurant('McDonald'); console.log(McDonald.getName()); // 'McDonald' McDonald.buy(); console.log(McDonald.getTotal()); // 9
더 유연한 방식의 2인 1
모듈 패턴을 사용하면 여러 번 호출할 수 있으며 각 실행 후에는 삭제됩니다. 일부 초기화된 데이터는 생성자 메서드를 사용하여 전달할 수 있지만 프라이빗 멤버 속성은 퍼블릭 메서드에서 액세스할 수 없습니다. 프라이빗 데이터에 액세스해야 하는 퍼블릭 메서드가 많으면 모두 권한 있는 메서드에 작성하고 마지막으로 가져옵니다. 각 인스턴스에는 많은 불필요한 방법이 있습니다. 따라서 둘을 결합하면 서로 보완할 수 있고, 결합 방법도 매우 간단합니다
var Restaurant = (function() { // 私有属性 var _total = 10; // 私有方法 function _buyFood() { _total--; } // 构造函数 function restaurant(name) { this.name = name; this.getTotal = function() { return _total; } } restaurant.prototype.buy = function() { console.log(_total); // 10 _buyFood(); } restaurant.prototype.getName = function() { return this.name; } return restaurant; }) (); var McDonald = new Restaurant('McDonald'); console.log(McDonald.getName()); // 'McDonald' McDonald.buy(); console.log(McDonald.getTotal()); // 9
위 내용은 이 글의 전체 내용입니다. 아직 언급되지 않은 지식 포인트가 많이 있으니 이 글이 참고가 되셨으면 좋겠습니다. 초보자에게 도움이 됩니다.