자바스크립트 (50) 썸네일형 리스트형 배열 순서 바꾸기 let arr = [1,2,3,4]; [arr[1], arr[2]] = [arr[2], arr[1]]; console.log(arr); // [1,3,2,4] String.prototype.startsWith() && String.prototype.endsWith() String.prototype.startsWith() startsWith() 메서드는 어떤 문자열이 특정 문자로 시작하는지 확인하여 결과를 true 혹은 false로 반환합니다. const str1 = 'Saturday night plans'; console.log(str1.startsWith('Sat')); // Expected output: true console.log(str1.startsWith('Sat', 3)); // Expected output: false https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith String.prototype.startsWith() - JavaS.. Math.trunc() 프로그래머스 코딩 기초 트레이닝 문제를 풀다가 본 Math.trunc() Math.trunc() 함수는 주어진 값의 소수부분을 제거하고 숫자의 정수부분을 반환합니다. console.log(Math.trunc(13.37)); // Expected output: 13 console.log(Math.trunc(42.84)); // Expected output: 42 console.log(Math.trunc(0.123)); // Expected output: 0 console.log(Math.trunc(-0.123)); // Expected output: -0 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math.. 번들링과 웹팩 번들링(Bundling) 번들이란 묶는다는 뜻으로 뭔가를 묶는 작업이라는 것을 이름에서 유추할 수 있습니다. 번들링이란 모듈들의 의존성 관계를 파악하여 그룹화시켜주는 작업을 뜻합니다. 모듈이란 분리된 파일입니다. 그렇다면 파일을 모듈로 분리한 이유는 무엇일까요? 그것은 작업의 효율성을 위해서입니다. 스크립트의 크기가 점점 커지고 복잡해지면서 단순히 하나의 파일이나 클래스로만 관리하기에는 그 복잡하기 때문입니다. 그렇기 때문에 머리, 가슴, 팔, 다리를 따로 떼어서 모듈로서 작업을 할 필요가 생겼습니다. 분리된 모듈들은 연계성을 띄어야하기 때문에 모듈 내부에는 import로 외부 모듈의 기능을 가져오고 export로 외부 모듈에서의 접근을 허용하여 모듈의 기능을 내보냅니다. 모듈 import와 export.. Callback / Promise / async await 콜백(Callback) 비유로 이해하는 콜백함수 콜백 함수의 동작 방식은 유명 맛집 자리 예약과 같습니다. 유명한 맛집을 가면 자리가 없을때가 있어서 대기자 명단에 이름과 연락처를 쓰고 자리가 날 때까지 주변을 돌아다니죠. 만약 식당에 자리가 생기면 전화로 자리가 났다고 연락이 옵니다. 그 전화를 받는 시점이 콜백 함수가 호출되는 시점과 같습니다. 손님 입장에서는 자리가 날 때까지 식당에서 기다리지 않고 근처 가게에서 잠깐 쇼핑을 할 수도 있고 아니면 다른 식당 자리를 알아볼 수도 있습니다. 자리가 났을 때만 연락이 오기 때문에 미리 가서 기다릴 필요도 없고, 직접 식당 안에 들어가서 자리가 비어 있는지 확인할 필요도 없습니다. 자리가 준비된 시점, 즉 데이터가 준비된 시점에서만 우리가 원하는 동작(자리.. 비동기 Before You Learn 위 예시를 읽고, 아래 개념을 대략적으로 이해할 수 있다. blocking / non-blocking && synchronous / asynchronous 전화 문자 하던 일을 멈추고 받아야 한다 (blocking) 확인 후, 나중에 답장할 수 있다 (non-blocking) 요청에 대한 결과가 동시에 일어난다 (synchronous) 요청에 대한 결과가 동시에 일어나지 않는다 (asynchronous) 비동기의 주요 사례 DOM Element의 이벤트 핸들러 마우스, 키보드 입력 (click, keydown 등) 페이지 로딩 (DOMContentLoaded 등) 타이머 타이머 API (setTimeout 등) 애니메이션 API (requestAnimationFrame) 서.. JSON JSON이란? JSON은 JavaScript Object Notation의 줄임말로, 데이터 교환을 위해 만들어진 객체 형태의 포맷입니다. JSON (JavaScript Object Notation) simplest data interchange format (데이터를 주고받을 때 사용할 수 있는 가장 간단한 포맷) lightweight text-based structure (텍스트을 기반으로 한 가벼운 구조) easy to read (읽기 쉬운) key-value pairs (키와 값으로 이루어진) used for serialization and transmission of data between the network the network connection (데이터를 서버와 주고 받을 때, 직렬화하고.. 객체 지향 프로그래밍(OOP, Object-oriented programming) 객체 지향 프로그래밍이란? 객체 지향 프로그래밍은 하나의 모델이 되는 청사진(blueprint)을 만들고, 그 청사진을 바탕으로 한 객체를 만드는 프로그래밍 패턴입니다. 앞서 언급된 청사진은 자동차 생산을 위한 설계도에 비유됩니다. 자동차가 기능하기 위해서는 네 바퀴와 핸들, 좌석, 그리고 엔진이 필요할 것입니다. 이러한 기본적인 설계는 차의 종류에 상관없이 대체적으로 동일하게 적용됩니다. 이런 설계도(청사진)을 바탕으로 각각의 객체가 특정한 자동차 모델로 나오게 되는 것입니다. 사실, 이미 자바스크립트에는 "객체"라는 개념이 객체 지향 프로그래밍과 무관하게 이미 존재합니다. 따라서 자바스크립트에서는 용어를 잘 구분하는 것이 중요합니다. 앞으로, 그냥 객체가 아닌 "청사진"을 바탕으로 한 객체는 인스턴스.. 이전 1 2 3 4 ··· 7 다음
