가자미의 개발이야기

promise.all : 여러 개의 프로미스 인스턴스를 받아 모두 완료될 때까지 기다리고 모든 반환값을 반환 promise.race : 여러 개의 프로미스 인스턴스 중 가장 먼저 끝날 때까지 기다리고 가장 먼저 끝난 반환 값을 반환 //promise.all & promise.race const getDog = async ()=>{ await sleep(1000); return 'bark!'; } const getCat = async ()=>{ await sleep(1000); return 'meow!'; } async function process2(){ const results=await Promise.all([getDog(), getCat()]); //promise배열을 받아 모두 끝나면 동시에 결과..

async : 함수 앞에 붙이면, 반환 값이 반드시 promise형이 된다. await : async에만 사용할 수 있음. 프로미스 인스턴스가 완료될 때까지 대기. then과 비슷 //async & await function sleep(ms){ return new Promise(resolve=> setTimeout(resolve,ms)); } async function process(){ console.log('hello'); await sleep(1000); console.log('nice to meet u'); return true;//async의 반환형은 promise(then catch사용 가능) } process();

promise : 특정 콜백을 조건에 따라 성공/실패로 나눠주는 역할. resolve : 성공했을 경우에 성공 결과를 반환하는 메소드 reject : 실패했을 경우에 에러를 반환하는 메소드 then : promise 인스턴스가 성공적으로 실행하고 나서 다음에 할 행동을 콜백으로 실행 catch : promise 인스턴스가 오류를 일으킬 경우 처리할 행동을 실행 //비동기 작업 다루기 promise //많은 콜백함수를 정리할 때 사용 const myPromise = new Promise((resolve, reject)=>{ setTimeout(()=>{ resolve('result');//성공하는 상황에서는 resolve }, 1000) setTimeout(()=>{ reject(new Error());/..

setTimeout : ms초 뒤에 백그라운드에서 작업할 콜백을 정의 //비동기 작업 다루기 setTimeout function work(callback){ setTimeout(()=>{//백그라운드에서 작업실행 const start = Data.now(); for(let i=0;i{ console.log('작업이 끝났어요'); console.log(ms+'ms'); }); console.log('다음작업'); 콜백을 매개변수로 받는 work 함수. work함수는 setTimeout으로 반복문 작업을 하고 매개변수 콜백을 마지막으로 실행.

spread : 다른 변수나 배열의 원소를 그대로 계승함을 의미(...으로 표현) //spread const slime={ name : 'slime' }; const cuteSlime={ ...slime,//spread attribute: 'cute' }; const animals=['dog', 'cat']; const anotherAnimals=[...animals, 'pigeon']; rest : 객체나 배열에서 특정값을 제외한 나머지를 반환해서 배열이나 객체를 반환 매개변수로 rest를 사용시 여러 매개변수를 받아 배열로 만드는 역할을 함. //rest const purpleCuteslime={ name: 'slime', attribute:'cute', color:'purple' }; const {..

//비구조할당 const object = { a:1}; const {a, b=2}=object; const array = [1]; const [one, two=2]=array; const deepObject={ state:{ information:{ name:'name', lang: ['korean', 'japan','china'] } }, value : 5 }; const {name, lang}=deepObject.state.information; const {value}= deepObject; const { state2:{ information2:{ name,lang2 } }, value }=deepObject;

자바스크립트에서 false 판정이 되는 것들을 falthy, true 판정이 되는 것을 truthy. //falthy & truthy false ==null ==0 =='' ==NaN ==undefined; //그 외는 모두 true //단축평가 논리연산 //&&연산시 전항이 참일 경우 뒷 항을 출력 //||연산시 전항이 거짓일 경우 뒷 항을 출력

변수 = (조건) ? (조건이 참일 경우 변수에 할당) : (조건이 거짓일 경우 변수에 할당) //삼항연산자 const array=[]; let text=array.length===0 ?'empty' :'not empty'; //복합 삼항연산자(비추, 차라리 조건문) const condition1 = false; const condition2 = false; const value = condition1 ? 'wow' : condition2 ? 'blabla' : 'foo';

constructor : 자바의 생성자와 동일한 기능. 클래스 멤버 변수에 값을 초기화. //class class Animal{ constructor(type, name, sound){//생성자 this.type=type; this.name=name; this.sound=sound; } say(){ console.log(this.sound); } } class Dog extends Animal{//상속 예시 constructor(name, sound){ super('개', name, sound); } }

call : 상위 개체에 매개변수를 전달하면서 인스턴스를 생성. //객체 생성자와 상속 function Animal(type, name, sound){ this.type=type; this.name=name; this.sound=sound; } Animal.prototype.say=function(){ console.log(this.sound); } function Dog(name, sound){ Animal.call(this, '개', name, sound); } function Cat(name, sound){ Animal.call(this, '고양이', name, sound); } Dog.prototype=Animal.prototype; Cat.prototype=Animal.prototype;