JS setTimeout/setInterval/call/apply/bind

---

Time Scheduling

---

1.setTimeout(일정 시간이 지난 후 함수를 실행)

1)3초후에 fn에 4를 넣어 호출해보기

//1번방법
function fn(number){
	console.log(number)
}
setTimeOut(fn,3000,4);

//2번방법
setTimeout(function(number){
	console.log(number)
},3000,4)

//3번방법
setTimeout((number)=>{
	console.log(number)
},3000,4)

2)예정된 스케줄링 취소하기

function showName(name){
	console.log(name);
}
const tId=setTimeout(showName,3000,'jiwoong')
clearTimeout(tId)
//setTimeout은 time id를 반환한다,
//그반환값을 넣어줘야하기때문에 변수선언을 함

2.setInterval(일정 시간 간격으로 함수를 반복)

1)//3초마다 'Mike'찍기

function showName(name){
	console.log(name);
}
const tId =setInterval(showName,3000,'Mike');
//clearInterval(tId);로 중단 시킬 수 있다
//setInterval은 time id를 반환한다
//그반환값을 넣어줘야하기때문에 변수선언을 함

---

this 지정하기(call,apply,bind)

---

1.call,apply

• 모든 함수에서 사용할 수 있고, 특정값을 this로 지정할 수 있다

const mike={
 name:'Mike'
}

const tome ={
 name:'Tom'
}

function showThisName(){
 console.log(this.name)
}

showThisName();//이 함수의 this는 window이다
showThisName.call(mike)//

function update(birthYear,occupation){
 this.birthYear =birthYear;
 this.occupation =occupation; 
}

update.call(mike,1999,'singer')
//첫인자는 this의 대상, 두번째부터는 해당 함수의 인자가 차례로
update.apply(tom,[2002,'teacher'])
//배열을 넣어준다는 것외에는 call과 같음 

2.bind

• 함수의 this값을 영구적으로 바꿀 수 있다

const mike={
name:'mike'
}
function update(birthYear,occupation){
 this.birthYear =birthYear;
 this.occupation =occupation; 
}
const updateMike =update.bind(mike);//this가 mike인 함수를 반환
updateMike(1980,'police')//바인딩된 함수를 사용

const user ={
  name:'Mike',
  showName: function(){
  console.log(`hello,${this.name}`)
 }
}
user.showName();//this가 user임 ,메소드의경우 (.) 앞이 this임

let fn =user.showName;
fn() //this가 없는 상태

let boundFn =fn.bind(user);
boundFn() //this가 user로 바인드됨