언어(Language)/Javascript(24)
-
js 비동기 처리(promise, await&callback)
자바스크립트는 동기적인 언어? ● js는 동기적인 언어이고, blocking이며, single-threaded한 언어이다. 하지만 이것은 한 번에 한 번의 작업만 진행할 수 있다는 특성을 의미한다. 하지만 js의 모든 것에서 이러한 특성을 의미하지는 않는다. 만약 많은 양의 데베를 요청해야 한다면 어떻게 할까? 동기적으로 처리한다면 하나의 작업에 대한 요청을 하고 응답을 기다리는 동안 다른 작업은 대기해야 할 것이다. 시간이 굉장히 오래 걸린다. ●js는 이러한 이슈를 해결하기 위해 해결책을 제시했다. 사람들이 js가 비동기적 언어라고 오해하는 이유가 js를 비동기적으로 동작하도록 할 수 있기 때문이다. 자바스크립트의 비동기 처리 ● 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를..
2023.03.10 -
동기(Synchronous) & 비동기(Asynchronous)
데이터를 처리하는 방식 => 동기, 비동기 처리 동기와 비동기 ● 동기 방식은 서버에서 요청을 보냈을 때 응답이 돌아와야 다음 동작을 수행할 수 있다. 즉 A작업이 모두 진행 될 때까지 B작업은 대기해야한다. ● 비동기 방식은 반대로 요청을 보냈을 때 응답 상태와 상관없이 다음 동작을 수행할 수 있다. 즉 A작업이 시작하면 동시에 B작업이 실행된다. A 작업은 결과값이 나오는 대로 출력된다. 동기적 처리(Synchronous) console.log("1st"); console.log("2nd"); console.log("3rd"); 위와 같은 코드를 작성하고 실행해 보면 예상되는 결과는 1st, 2nd, 3rd일 것이다. '1st' '2nd' '3rd' 예상했던 것처럼 1st, 2nd, 3rd가 차례대로..
2023.03.10 -
[코딩앙마] 자바스크립트 중급 강좌 : 140분 완성 60-
구조 분해 할당(Destructuring assignment) : 구조 분해 할당 구문은 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식 나머지 매개변수, 전개 구문(Rest parameters, Spread syntax) ... arguments 1. 함수로 넘어 온 모든 인수에 접근 2. 함수 내에서 이용 가능한 지역 변수 3. length / index 4. Array 형태의 객체 5. 배열의 내장 메서드 없음(forEach, map) 전개 구문(Spread syntax) : 배열 클로저(Closure) 어휘적 환경(Lexical Environment) Closure 1. 함수와 렉시컬 환경의 조합 2. 함수가 생성될 당시의 외부 변수를 기억 3. 생성 이후에도 계속 접근..
2023.03.04 -
[코딩앙마] 자바스크립트 중급 강좌 : 140분 완성 41-60
[Array] arr.splice(n, m) : 특정 요소 지움 n은 시작, m은 개수 arr.splice(n, m, x) : 특정 요소 지우고 추가 arr.splice() : 삭제된 요소 반환 arr.slice(n, m) : n부터 m까지 반환 arr.concat(arr2, arr3 ..) : 합쳐서 새배열 반환 arr.forEach(fn) : 배열반복 arr.indexOf/arr.lastIndexOf arr.includes() : 포함하는지 확인 arr.find(fn)/arr.findIndex(fn) : 함수 연결 가능 첫 번째 true값만 반환하고 끝 만약 없으면 undefined를 반환 arr.filter(fn) : 만족하는 모든 요소를 배열로 반환 arr.reverse() : 역순으로 재정렬 a..
2023.03.03 -
[코딩앙마] 자바스크립트 중급 강좌 : 140분 완성 1-20
변수 호이스팅 TDZ (Temporal Dead Zone) 변수 let const var 1) var var는 한 번 선언된 변수를 다시 선언할 수 있다 var name = 'Mike'; console.log(name); //Mike var name = 'Jane'; console.log(name); //Jane *같은 상황에서 let은 문제가 발생 var는 선언하기 전에 사용할 수 있다 console.log(name); //undefined var name = 'Mike'; 왜냐하면 var는 var name; console.log(name); //undefined name='Mike'; 로 동작하기 떄문 var로 선언한 모든 변수는 코드가 실제로 이동하지는 않지만 최상위로 끌여올려진 것처럼 작동, 이를..
2023.03.01 -
[코딩앙마] 자바스크립트 기초 강좌: 100분 완성
1. confirm() : 무엇인가를 확인 받을 떄 사용 가능 윈도우 확인() - 웹 API | 증권 시세 표시기 (mozilla.org) Window.confirm() - Web API | MDN Window.confirm() 메서드는 확인과 취소 두 버튼을 가지며 메시지를 지정할 수 있는 모달 대화 상자를 띄웁니다. developer.mozilla.org 0, "", null, undefined, NaN [주의사항] Number(null) //0 Number(undefined) //NaN [주의사항] Number(0) //false Number('0') //true Number('') //false Number(' ') //true **함수 선언문 : 어디서든 호출 가능** sayHello(); fu..
2023.02.15