프로그래머스 > 코딩테스트 연습 > 코딩테스트 입문 > 옹알이(1) 난이도 0단계 중 정답률이 가장 낮게 측정이 되고 있다. 문제설명 머쓱이는 태어난 지 6개월 된 조카를 돌보고 있습니다. 조카는 아직 "aya", "ye", "woo", "ma" 네 가지 발음을 최대 한 번씩 사용해 조합한(이어 붙인) 발음밖에 하지 못합니다. 문자열 배열 babbling이 매개변수로 주어질 때, 머쓱이의 조카가 발음할 수 있는 단어의 개수를 return 하도록 solution 함수를 완성해 주세요. 제한사항 1 ≤ babbling의 길이 ≤ 100 1 ≤ babbling[i]의 길이 ≤ 15 babbling의 각 문자열에서 "aya", "ye", "woo", "ma"는 각각 최대 한 번씩만 등장합니다. 즉, 각 문자열의..

0. Mongoose란 Mongoose를 간단하게만 소개하자면, Mongo DB ODM 중 가장 유명하고 많이 쓰이는 자바스크립트 객체 지향 프로그래밍 라이브러리라고 한다. ODM Object Document Mapping 객체와 문서를 1대 1 매칭한다는 의미 Object - 자바스크립트의 객체 / Document - 몽고 DB의 문서 즉, 문서를 DB에서 조회할 때 자바스크립트 객체로 바꿔주는 역할을 하는 것 1. 오류 발생 배경 Node.js 교과서를 보고 공부하던 도중 서버를 실행시켜보려 했는데 에러가 떴다. 오류 메세지를 읽어보면 connect 함수가 더 이상 콜백을 지원하지 않는다는 것이었다. OwO... 2. 원인 및 해결 찾아보니 이전에는 connect 함수와 콜백 함수를 사용했지만, Mo..

0. 동기 동기적 처리 (Synchronous) 순차적 실행 서버에 요청을 보냈을 때 응답이 돌아온 뒤 다음 동작을 수행 A 작업이 모두 진행되어 마칠 때까지 B 작업은 대기 ex. console.log('first'); console.log('second'); console.log('third'); /* first second third */ 위와 같이 코드를 작성한 뒤 실행되는 결과를 확인해 보면 위에서부터 한 줄씩 내려오며 하나의 작업이 완전히 끝난 뒤 다음 코드가 차례로 실행되는 것을 확인할 수 있다. 이를 동기적 처리 방식이라고 한다. 1. 비동기 비동기적 처리 (Asynchronous) 서버에 요청을 보냈을 때 응답 상태와 관계 없이 다음 동작 수행 가능 A 작업이 시작되면 동시에 B 작업 실..

0. JQuery란? 웹사이트에 자바스크립트를 쉽게 활용할 수 있도록 도와주는 오픈소스 기반의 자바스크립트 라이브러리 거의 모든 웹 브라우저에 적용이 될 정도로 여러 브라우저에 대한 호환성이 있음 물론 JS 만으로도 충분히 구현이 가능하지만, 코드를 쉽고 간결하게 작성할 수 있도록 도움을 줌 CDN을 불러와야 하기 때문에, 코드가 길어지고 무거워지면 JS와 비교하였을 때 시간이 조금 더 걸릴 수 있다는 특징 사실 JQuery는 점점 입지가 줄어들고 있다고 한다. React나 Vue와 같은 자바스크립트 라이브러리가 많이 사용되며 그만큼 JQuery에 대한 관심도가 줄어드는 것 같다고 생각한다. 실제로 google trend 사이트에 들어가 해당 검색어에 대한 작년 5년간의 관심도 변화를 확인할 수 있는데,..

0. DOM이란? Document Object Model XML / HTML 문서에 접근하기 위한 일종의 인터페이스 문서 내의 모든 요소 정의 각각의 요소에 접근하는 방법 제공 1. DOM의 구조 DOM은 그림에서 확인할 수 있듯이, 트리 형식으로 이루어져 있다. ★ tree란? 방향성이 있으며, 순환하지 않는 그래프의 한 종류 정점(node)와 간선(edge)를 활용해 데이터의 배치 형태를 추상화한 자료구조 노드가 N개인 트리는 항상 N-1개의 간선을 가짐 노드들이 나무 가지처럼 연결되었으며, 나무를 거꾸로 뒤집어 둔 형태와 유사 위쪽의 노드를 부모(parent) 노드라고 하며, 아래쪽 노드를 자식(child) 노드라고 한다. root node : 최상단에 있는 노드, parent node가 존재하지 ..

0. 자바스크립트에서 함수란? 득정 작업을 수행하기 위해 독립적으로 설계된 코드들의 집합 명령어의 묶음 재사용 가능한 영역을 정의 코드를 캡슐화하는 데에 도움이 됨 일반적으로 '입력(input) → 함수 → return문 → 출력(output)' 순으로 구성 함수 정의 : 함수를 "생성" 함수 호출 : 함수를 "사용" [ 특징 ] 함수 = 객체 function이라는 키워드로 정의 / 생성하며 출력이 가능 객체이기 때문에 함수를 변수나 배열에 저장 가능 다른 함수 호출 시 인자를 넘겨줄 수 있음 동일한 작업을 반복 (반복 작업을 줄이며 코드 재사용성 ↑) 유지보수 편리 1. 함수의 종류 1.1 내장 함수 이미 언어에서 자주 쓰이는 기능을 만들어 놓은 함수 ex. alert ( ), confirm ( ), ..

WebPack 여러 개의 파일을 하나의 파일로 묶어주는 모듈 번들러 (Module Bundler) [ 장점 ] 웹 애플리케이션의 로딩속도를 줄이기 위한 방법 : 클라이언트 (브라우저) 에서 서버로 요청하는 개수를 줄이는 것 여러 파일의 자바스크립트 코드를 압축 -> 최적화 할 수 있음 -> 로딩에 대한 네트워크 비용 절감 모듈 단위의 개발이 가능 -> 가독성과 유지보수가 쉬움 최신 자바스크립트 문법을 지원하지 않는 브라우저에서 사용할 수 있는 코드로 쉽게 변환

1. 모듈(Module)이란? - 개발하는 애플리케이션의 규모가 커지면 파일을 여러 개로 분리하는 것이 좋음 - 이 때 분리된 하나의 파일을 모듈이라고 부름 - 모듈을 대개 클래스 하나 혹은 특정한 목적을 가진 여러 개의 함수를 포함하는 라이브러리로 구성되어 있음 [ 장점 ] 유지보수 용이 기능들이 모듈화가 잘 되어 있는 경우, 의존성을 줄일 수 있기 때문에 기능의 개선이나 수정이 용이 네임스페이스화 코드의 양이 많아질수록 전역 스코프에는 존재하는 변수명이 겹치는 경우가 존재 -> 이때 모듈로 분리하면 모듈만의 네임스페이스를 따로 가지기 때문에 해당 문제를 해결할 수 있음 재사용성 같은 코드를 반복하지 않고 모듈로 분리시켜서 필요할 때마다 재활용 가능 2. 모듈 시스템 - 모듈을 필요시에 불러오는 방법 ..

2.1 자바스크립트 유용한 Array APIs 1) map ( ) 배열 내의 모든 요소에 대해 주어진 함수를 호출한 결과를 모아서 새로운 배열을 반환 const numbers = [1, 2, 3, 4, 5, 6, 7]; const result = numbers.map((number) => number * 2); console.log(result); // [2, 4, 6, 8, 10, 12, 14] 2) some ( ) 배열 안의 한 요소라도 주어진 판별 함수를 통과하는지 테스트 const animals = ["강아지", "고양이", "토끼", "병아리", "호랑이", "말"]; const result = animals.some((animals) => animals === "강아지"); console.lo..

1. IT 용어 이해 1.1 API란 무엇인가? - Application Programming Interface - 응용 프로그램에서 사용할 수 있도록, 운영 체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스 - User Interface, 즉 사용자와 프로그램과 소통하기 위한 접점 1.2 동기와 비동기란? - 동기 : 답변을 기다리는 것 - 비동기 : 답변을 기다리지 않는 것 1.3 프론트엔드 & 백엔드란? 프론트엔드 : 사용자가 마주 보는 인터페이스로, 주로 웹 및 모바일의 사용자 인터페이스 (UI) / 사용자 경험 (UX)를 개발하는 데에 초점 - 언어 : HTML, CSS, JavaScript - 테크놀로지 : AngularJS, ReactJS, Bootstrap 백엔드 :..