Javascript (32) 썸네일형 리스트형 자바스크립트 중급 18 - Generator *Generator : 함수의 실행을 중간에 멈췄다가 재개할 수 있는 기능 function* fn() { console.log(1); yield 1; console.log(2); yield 2; console.log(3); console.log(4); yield 3; return "finish"; } catch (e) { console.log(e); } const a = fn(); next(), return(), throw() iterable -Symbol.iterator 메서드가 있다. -Symbol.iterator 는 iterator를 반환해야 한다. iterator -next 메서드를 가진다. -next 메서드는 value와 done속성을 가진 객체를 반환한다. -작업이 끝나면 done은 true가.. 자바스크립트 중급 17 - async, await async function getName() { //return Promise.resolve("Tom"); throw new Error("err..."); } getName().catch((err) => { console.log(err); }); //await : async함수 내부에서만 사용가능 function getName(name) { return new Promise ((resolve, reject) => { setTimeout(() => { resolve(name); }, 1000); }); } async function showName(){ const result = await getName('Mike'); console.log(result); } console.log("시작"); showNa.. 자바스크립트 중급 16 - 프로미스(Promise) const pr = new Promise((resolve, reject) => { (resolve: 성공했을 때 실행되는 함수, reject: 실패했을 때 실행되는 함수) //code }); → 어떤 일이 완료된 이후 실행되는 함수: callback 함수 state: pending(대기) result: undefined ↓ resolve(value) ☞ state: fulfilled(이행됨) result: value (resolve로 전달받은 값) reject(error) ☞ state: rejected(거부됨) result: error ex) const pr = new Promise((resolve, reject) => { setTimeout(()=>{ resolve('OK') }, 3000) }); .. 자바스크립트 중급 15 - 클래스(Class) //생성자 함수 const User = function (name, age){ this.name = name; this.age = age; //this.showName = function() { // console.log(this.name); //}; }; User.prototype.showName = function (){ console.log(this.name); }; const mike = new User("Mike", 30); class User2 { constructor(name, age) { //constructor: 객체를 만들어주는 생성자 메소드 this.name = name; this.age = age; } showName(){ //클래스 내에 정의된 메소드는 User2의 프로토타입에 저.. 자바스크립트 중급 14 - 상속, 프로토타입(Prototype) const car = { wheels : 4, drive() { console.log("drive.."); }, }; const bmw = { color : "red", navigation : 1, }; const benz = { color : "black", }; const audi = { color : "blue", }; bmw.__proto__ = car; //bmw는 car에 상속 const x5 = { color : "white", name : "x5", }; x5.__proto__ = bmw; //x5는 bmw에 상속 //Prototype Chain ▶ for ...in 을 이용해서 객체의 프로퍼티 순환하기 for (p in x5){ console.log(p); } x5 : {color: "w.. 자바스크립트 중급 13 - call, apply, bind *call, apply, bind: 함수 호출 방식과 관계없이 this 를 지정할 수 있음. 1. call call메서드는 모든 함수에서 사용할 수 있으며, this를 특정값으로 지정할 수 있다. const mike = { name : "Mike", }; const tom = { name : "Tom", }; function showThisName() { console.log(this.name); } showThisName(); //this = window showThisName.call(mike); //this = mike const mike = { name : "Mike", }; const tom = { name : "Tom", }; function showThisName() { console.log.. 자바스크립트 중급 12 - setTimeout / setInterval *setTimeout : 일정 시간이 지난 후 함수를 실행 *setInterval : 일정 시간 간격으로 함수를 반복 function fn(){ console.log(3) } setTimeout(fn, 3000); //fn: 일정시간 지난 후 실행되는 함수 // 3000 = 3s setTimeout(function(){ console.log(3) }, 3000); = 위 함수와 똑같은 내용 //함수에 인수가 존재할 때 function showName(name){ console.log(name); } setTimout(showName, 3000, 'Mike'); //→Mike는 name의 첫번째 인수로 전달 // 함수 시간 인수 clerTimeout은 예정된 작업을 없앰. function showName(.. 자바스크립트 중급 11 - 클로저(Closure) *js는 '어휘적 환경(Lexical Environment)' 을 갖는다. let one; //→ undefined one = 1; //→ 1 function addOne(num){ //addOne: function console.log(one + num); } addOne(5); → Lexical 환경: one- 초기화X (사용 불가) / addOne- function 초기화O (사용 가능) [내부 Lexical 환경] → [전역 Lexical 환경] num : 5 참조 one : 1 addOne : function 내부 → 외부 → 전역 Lexical 환경 순으로 찾는다. function makeAdder(x){ //1. return function(y){ //makeAdder : function r.. 이전 1 2 3 4 다음 목록 더보기