Front-end/HTML+CSS+JS10 [JS] 비동기 프로그래밍 Summary 1. 동기 vs 비동기 동기정해진 순서대로 한 번에 한 가지 일만 한다. ( 작업 1 이 다 끝나고 나서 작업 2를 수행하고, 작업 2가 다 끝나면 작업 3을 수행한다. )자바스크립트 엔진은 기본적으로 동기적으로 실행되도록 되어 있다. (default) = "자바스크립트는 싱글 스레드 언어이다." = 자바스크립트는 한 번에 한 가지 일만 할 수 있는 것이 default 이다.비동기작업이 끝날 때까지 기다리지 않고 다음 작업을 실행할 수 있도록 한다.setTimeout 함수는 비동기 함수이다.console.log('1');setTimeout(() => { console.log('2');}, 3000);console.log('3');// output //132 ❓근데 자바스크립트는 동기 .. 2025. 6. 11. [JS] 배열 요약하나의 객체 요소들을 순회할 때는 for .. in 구문을 사용하고 배열을 순회할 때는 for .. of 구문을 사용한다는 것을 주의하자. 배열을 순회할 때 for .. in 구문을 사용하면 인덱스가 출력된다.예제하나의 객체 요소들을 순회할 때는 for .. in 구문을 사용하고 배열을 순회할 때는 for .. of 구문을 사용한다는 것을 주의하자. 배열을 순회할 때 for .. in 구문을 사용하면 인덱스가 출력된다. let days = ['mon', 'tue', 'wed'];// 추가days.push('thu'); // ['mon', 'tue', 'wed', 'thu']days.unshift('sun'); // ['sun', 'mon', 'tue', 'wed', 'thu']// 제거days.pop.. 2025. 6. 7. [JS] 객체 요약C++와 JAVA의 클래스와 유사this가 필요한 경우 화살표 함수 지양let boy = { name: 'hyeon', sayThis : function() { console.log(`안녕하세요, ${this.name}씨`); }};boy.sayThis(); 프로퍼티 추가 / 값 접근 및 수정 / 프로퍼티 삭제예제객체명[key값] , 객체명.key값 으로 추가/접근/수정/삭제 가능삭제의 경우 앞에 delete 키워드 사용let boy = { name: 'hyeon', sayThis : function() { console.log(`안녕하세요, ${this.name}씨`); }};// 프로퍼티 추가boy.sex = 'man'; // sex: .. 2025. 6. 7. [JS] 화살표 함수(Arrow Function) : 함수 표현식을 간결하게 요약ES6에서 도입된 새로운 함수 방식함수 표현식을 아래와 같이 간단하게 할 수 있다.function greet(name) { console.log("Hi, " + name);}// 화살표 함수로 변환let greet = name => { console.log("Hi, " + name);};greet("hyeseon"); // 함수 호출 this 객체를 사용할 환경이라면 화살표 함수를 사용하지 않는 것이 좋다.let boy = { name: 'hyeon', sayThis: () => { console.log(this); // 화살표 함수에서 this는 boy 객체가 아니라 전역 객체(window)를 가르킨다. }};boy.sayThis(); 화살표 함수로 바꾸는 .. 2025. 6. 7. 이전 1 2 3 다음
