THIS 사용 시나리오 요약

1. 현재 원소의 어떤 이벤트 귀속 방법을 주고 이벤트 트리거 방법이 실행될 때 방법 중의this는 현재 조작의 원소 대상이다

oBox.onclick = function(){
	// => this oBox
}

2. 일반 함수 집행, 함수 중의this는 집행의 주체에 달려 있다. 누가 집행하는this는 바로 누가 즉각 집행하는 함수로 대상 호출이 없기 때문에this는 window이다(엄격한 모드에서 점this는undefined이다)

let fn = function () {
	console.log(this.name);
};
let obj = {
	name: ' ',
	fn: fn
};
fn(); //this:window
obj.fn();//this:obj

3. 구조 방법 집행, 방법체 중의this는 현재 클래스의 실례

let Fn = function() {
	this.x = 100; //this:f
};
let f = new Fn;

4. 화살표 함수에 자신의this가 없음,this는 상하문에서의this

let obj = {
	fn: function() {
		//this:obj
		setTimeout(() => {
			//this: obj
		}, 1000)
	}
}
obj.fn()

5. 소괄호 표현식에서this의 지향에 영향을 미친다

let obj = {
	fn: function(){
		console.log(this);
	}
}
obj.fn();//this:obj
(12, obj.fn)();//this:window

6.call/apply/bind를 사용하면this지향을 바꿀 수 있습니다

fn.call(obj);//this:obj
fn.call(12)//this:12
fn.call();//=>this:window, call/apply/bind null undefined ，this window，
// undefined

var n = 2;
var obj = {
  n: 3,
  fn: (function (n) {
    n *= 2;
    this.n += 2;
    var n = 5;
    return function (m) {
      this.n *= 2;
      console.log(m + (++n))
    }
  })(n)
};
var fn = obj.fn;
fn(3);
obj.fn(3);
console.log(n, obj.n);//9, 10, 8, 6