본문 바로가기

Javascript40

[Javascript] Javascript 문법 정리 Javascript 문법 정리 Javascript 문법에 대한 정리문서로 각 문법은 아래 포스팅 참고하면 된다. [Javascript] 기본문법 기본문법 주석 주석은 작성된 코드의 의미를 설명하기 위해 사용한다. // : 한 줄 주석 /* */ : 여러 줄 주석 /* 여러줄 주석 */ // 한줄주석 출력 가장 기본적인 출력은 방법은 alert() 함수를 사용. aler ypangtrouble.tistory.com [Javascript] 데이터 타입 데이터 타입 데이터 타입은 프로그래밍 언어에서 사용할 수 있는 데이터(숫자, 문자열, 불리언 등)의 종류를 말한다. 코드에서 사용되는 모든 데이터는 메모리에 저장되고 참조될 수 있어야 한 ypangtrouble.tistory.com [Javascript] 변수.. 2023. 12. 14.
[Javascript] ES6 - async / await async / await async / await 는 ES2017에서 도입된 문법으로 Promise 로직을 더 쉽고 간결하게 사용할 수 있게 해준다. 하지만 완전히 Promise를 대체하기 위한 기능은 아니다. 사용법은 function 키워드 앞에 async 를, 비동기 처리되는 부분 앞에 await 키워드만 작성해주면 된다. // 기존 Promise.then() 형식 function main() { delay(1000) .then(() => { return delay(2000); }) .then(() => { return Promise.resolve('끝'); }) .then(result => { console.log(result); }); } main(); // 메인 함수 호출 // a.. 2023. 12. 11.
[Javascript] ES6 - 프로미스(Promise) 프로미스(Promise) Promise 객체는 비동기 작업의 최종 완료 또는 실패를 나타내는 Array나 Object 처럼 독자적인 객체라고 보면 된다. 비동기 작업이 끝날 때까지 결과를 기다리는 것이 아니라, 결과를 제공하겠다는 약속을 반환한다는 의미이다. 프로미스 객체 생성 Promise 객체를 생성하기 위해 new 키워드와 생성자 함수를 사용한다. 생성자는 2개의 매개변수를 가진 콜백 함수를 넣게 되는데 첫 번째 인수는 작업이 성공했을 때 성공(resolve)을 알려주는 객체이며 두 번째 인수는 작업이 실패했을 때 실패(reject)임을 알려주는 객체이다. const myPromise = new Promise((resolve, reject) => { // 비동기 작업 수행 const data = f.. 2023. 12. 8.
[Javascript] ES6 - 콜백 함수(Callback) 콜백 함수(Callback) 콜백(Callbakc) 함수 란 매개변수로 함수 객체를 전달해서 호출 함수 내에서 매개변수 함수를 실행하는 것을 말한다. 그리고 파라미터로 일반적인 변수나 값을 전달하는 것이 아닌 함수 자체를 전달하며 일회용으로 사용하기 때문에 함수의 이름이 없는 익명 함수를 형태로 사용한다. function sayHello(name, callback) { const words = '이름은 ' + name + ' 입니다.'; callback(words); // 매개변수의 함수(콜백 함수) 호출 } sayHello("sanggil", function (name) { console.log(name); // 이름은 sanggil 입니다. }); ES6에서 도입된 화살표.. 2023. 12. 7.
[Javascript] ES6 - 동기와 비동기 동기(synchronous)와 비동기(asynchronuous) 동기(synchronous) 방식은 이전 작업이 완료된 후 차례로 다음 작업을 순차적으로 싱핼하는 방식이며 비동기(asynchronuous) 방식은 여러 작업을 동시에 처리하기 위해 특정 작업의 완료를 기다리지 않고 다음 작업을 동시에 수행하는 방식이다. 동기(synchronous) 방식 동기(synchronous) 방식은 아래와 같은 특징을 가지고 있다. 직렬적으로 태스크를 수행하는 방식이다. 요청을 보낸 후 응답을 받아야지만 다음 동작이 이루어지는 방식이다. 어떠한 태스크를 처리할 동안 나머지 태스크는 대기한다. 실제로 cpu가 느려지는 것은 아니지만 시스템의 전체적인 효율이 저하된다고 할 수 있다. function firstFunc().. 2023. 12. 6.
[Javascript] ES6 - 커스텀 이터러블 커스텀 이터러블 일반 객체는 이터레이션 프로토콜을 준수(Symbol.iterator 메소드를 소유)하지 않기 때문에 이터러블이 아니다. 따라서 일반 객체는 for…of 문에서 순회할 수 없으며 Spread 문법의 대상으로 사용할 수도 없다. 하지만 일반 객체도 이터러블 프로토콜을 준수하도록 구현하면 이터러블이 되는데 이를 커스텀 이터러블 이라고 한다. const fibonacci = { // Symbol.iterator 메소드를 구현하여 이터러블 프로토콜을 준수 [Symbol.iterator]() { let [pre, cur] = [0, 1]; // 최대값 const max = 10; // Symbol.iterator 메소드는 next 메소드를 소유한 이터레이터를 반환해야 한다. // next 메소드는 .. 2023. 12. 5.
728x90