this
13828 ワード
既存のブログの内容をDevelopgに移行した記事です.
1. this
属するオブジェクトを参照するキーワード
関数呼び出しは、関数にバインドされる値、すなわちバインドを動的に決定します.
// this는 어디서든지 참조 가능하다.
// 전역에서 this는 전역 객체 window를 가리킨다.
console.log(this); // window
function square(number) {
// 일반 함수 내부에서 this는 전역 객체 window를 가리킨다.
console.log(this); // window
return number * number;
}
square(2);
const person = {
name: "Lee",
getName() {
// 메소드 내부에서 this는 메소드를 호출한 객체를 가리킨다.
console.log(this); // {name: "Lee", getName: ƒ}
return this.name;
},
};
console.log(person.getName()); // Lee
function Person(name) {
// 생성자 함수 내부에서 this는 생성자 함수가 생성할 인스턴스를 가리킨다.
console.log(this); // Person { name: "Lee" }
this.name = name;
}
const me = new Person("Lee");2.関数の呼び出しとバインド
関数呼び出し方式thisは、通常の関数呼び出しグローバルオブジェクトメソッド呼び出し方法のオブジェクトジェネレータ関数番号生成構造関数が作成するインスタンス機能をバインドします.prototype.Functionはapply/call/bindメソッドで間接的に呼び出されます.prototype.パラメータとしてapply/call/bindメソッドに渡すオブジェクト
≪一般関数の呼び出し|Call General Function|emdw≫:デフォルトではグローバル・オブジェクトがバインドされます.
メソッド呼び出し:呼び出しメソッドのオブジェクトをバインドします.(所有に関係なく)
コンストラクション関数を呼び出します.
コンストラクション関数の内部にあるthisでは、コンストラクション関数は作成するインスタンスをバインドします.
// 생성자 함수
function DiscountPrice(price) {
// 생성자 함수 내부의 this는 생성자 함수가 생성할 인스턴스를 가리킨다.
this.price = price;
this.getDiscountPirce = function () {
return 0.9 * this.price;
};
}
// 인스턴스의 생성
// 1000원인 상품 객체 생성
const price = new DiscountPrice(1000);
// 5000원인 상품 객체 생성
const price2 = new DiscountPrice(5000);
console.log(price.getDiscountPirce()); // 900
console.log(price2.getDiscountPirce()); // 4500//通常関数の呼び出しです.
const price3 = DiscountPrice(15000);
//一般関数DiscountPriceは文を返さないため、デフォルトでは未定義を返します.
console.log(price3);//undefined
//一般関数DiscountPriceのthisはグローバルオブジェクトを指します.
console.log(price);//15000
<br>
- Function.prototype.apply/call/bind 메소드에 의한 간접 호출
```javascript
함수.apply(this로바인딩될객체, [인수들]); // 실행까지 됨
함수.call(this로바인딩될객체, 인수, 인수, 인수); // 실행까지 됨
함수.bind(this로바인딩될객체); // 실행은 안됨applyメソッドとcallメソッドは、関数を呼び出すときに、最初の引数から渡された特定のオブジェクトの関数を呼び出すthisにバインドされます.
主にargumentsオブジェクトに類似した類似配列オブジェクトに配列メソッドを使用します.
function convertArgsToArray() {
console.log(arguments);
// arguments 객체를 배열로 변환
// slice: 배열의 특정 부분에 대한 복사본을 생성한다.
const arr = Array.prototype.slice.apply(arguments);
// const arr = Array.prototype.slice.call(arguments);
console.log(arr);
return arr;
}
convertArgsToArray(1, 2, 3); // [ 1, 2, 3 ]function Person(name) {
this.name = name;
}
Person.prototype.doSomething = function (callback) {
callback.bind(this)();
// callback.apply(this);
// callback.call(this);
};
function foo() {
console.log(this.name); // ②
}
const person = new Person("Lee");
person.doSomething(foo); // Lee3.番組の位置を決める
個別のプロパティが必要な場合は、this.プロパティとしてPropertyを追加
単一のプロパティを使用する方法.プロトタイプに追加
静的メソッドは、個別のプロパティを必要としない方法で使用します.
Reference
この問題について(this), 我々は、より多くの情報をここで見つけました https://velog.io/@seongkyun/thisテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol