코드스피츠85 2회

const Item = class{
    time;
    block;
    constructor(block, time) {
        this.block= block;
        this.time = time + performance.now();
}
const queue = new Set;

const f = time=> {
    queue.forEach(item=>{
        if(item.time > time) return;
        queue.delete(item);
        item.block();
    });
    requestAnimationFrame(f);
}
requestAnimationFrame(f);

const timeout = (block, time) => queue.add(new Item(block, time));
  ```  

- 함수는 어떻게 1초후에 일어나는걸까?
- 밀리세컨마다 1초지났는지 계속 확인하다가 1초지났을때 실행한다
- 푸쉬형을 선호한다 이벤트 기반의 프로그램을 짠다
- 원하는 사건에 내 코드가 호출되었으면 좋겠다
- 클릭할때 리스너가 뜨길 원한다(어떻게 동작하는지는 관여하고 싶ㅍ지 않다)
- 브라우저는 개발자를 바보로 만든다...ㅠㅠ
- 컴퓨터 사이언스로 보면 우리는 부탁만하는거다;
- `performance.now()` 브라우저가 시작되고 몇초가 지났는지(나노초 가능)

value 값

- 불변
- 메모리 자체가 아닌 그 자체로 판단

배열은 여러개일수도 있고 똑같은 값을 넣을수도있다

Set은 중복된 객체를 넣지 않기 위함

객체 지향에서 객체에대한 collection은 배열이 아니라 Set이다

## Non Blocking For

    const working = _ => {};
    for(let i=0; i< 100000; i++) working();
    
    const nbFor = (max, load, block) => {
    	let i = 0;
    	const f = time => {
    		let i = 0;
    		const f = time => {
    			let curr =load;
    			while(curr-- && i < max) {
    				block();
    				i++;
    			}
    			console.log(i);
    			if(i<max-1) requestAnimationFrame(i);
    		};
    		requestAnimationFrame(i);
    	}
    }
    
    nbFor(100, 10, working);
    -> 10씩 끊어서 분산해서 처리한다
    
    const nbFor = (max, load, block) => {
    	let i = 0;
    	const f = time => {
    		let i = 0;
    		const f = time => {
    			let curr =load;
    			while(curr-- && i < max) {
    				block();
    				i++;
    			}
    			console.log(i);
    			if(i<max-1) timeout(f, 0);
    		};
    		timeout(f, 0);
    	}
    }

## Generator

자바스크립트에서 인터페이스는 특정키나 값이 들어있는 형태를 지칭한다 ⇒ 오브젝트의 형태

루프의 주인공은 이터레이터다

이터레이터에게 넥스트 함수를 호출하면 오브젝트를 리턴한다

value, done이라는 키를 가진 오브젝트를 리턴

    const infinity = (function*() {
    	let i= 0;
    	while(true) yield i++;
    })();
    console.log(infinity.next());

generator를 호출하면 iterator 객체가 나온다

generator 자체로는 for..of를 사용 못함

infinity 만들자마 즉시 호출이므로 iterator 객체이다

function* 는 서스펜드 구간을 생성한다

동기명령은 멈출수 없지만 generator는 멈출수 있다

메모리 적재시에 명령마다 레코드라는것으로 감싸서  적재해두었고 하나를 실행할때마다 레코드를 풀어서 실행 → 서스펜드

yield 호출시에 서스펜드(멈춤)

resume(다시 시작)

명령어를 중간에 끊을수 있기 때문에 무한 크기의 배열을 만들수 있다

    const gene = function*(max, load, block) => {
    	let i = 0, curr = load;
    	while(i<max){
    		if(curr--){
    			block();
    			i++;
    		}else{
    			curr=load;
    			console.log(i);
    			yield;
    		}
    }
    
    const nbFor = (max, load, block)=>{
    	const iterator = gene(max, load, block);
    	const f=_=>iterator.next().done||timeout(f);
    	timeout(f,0);
    };

지역변수를 사용한다

제어구조를 외부에서 통제하도록 되어있다

## Promise