본문 바로가기

자바스크립트

[프로그래머스 Lv.1] 추억 점수 (javascript) https://school.programmers.co.kr/learn/courses/30/lessons/176963 [문제 풀이] 가장 짧은 예시인 두번째걸 보면 kali 는 11 mari 는 1 don 는 55 photo 의 첫번째 배열에서 11+1+55 = 67 인것이다 [코드 풀이] function solution(name, yearning, photo) { // key-value 객체로 점수 매칭 const matching = {}; for(let i=0; i i.reduce((arr, cur) => arr + (matching[cur] || 0), 0)) return answer; } photo 배열을 map 을 통해 돌려주고 (배열을 리턴해줌) matching[cur] 에 값이 있으면 arr .. 더보기
[2562][백준_브론즈3] 최댓값 - JavaScript https://www.acmicpc.net/problem/2562 2562번: 최댓값 9개의 서로 다른 자연수가 주어질 때, 이들 중 최댓값을 찾고 그 최댓값이 몇 번째 수인지를 구하는 프로그램을 작성하시오. 예를 들어, 서로 다른 9개의 자연수 3, 29, 38, 12, 57, 74, 40, 85, 61 이 주어 www.acmicpc.net 자바스크립트로 백준 문제 풀려면 입력과 출력의 코드를 알아야한다 여간 귀찮은게 아니다 .. 나는 코드 에디터로 vscode 를 사용중이기 때문에 이런식으로 입력 받은 글자들을 input.txt 에 적은 다음 Node.js 환경에서 파일 시스템 모듈인 fs를 사용하여 파일을 읽어들이는 코드를 사용하여야 한다 const fs = require('fs'); const i.. 더보기
[모던자바스크립트 DeepDive] 40장 이벤트 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. 이벤트 드리븐 프로그래밍 브라우저는 스스로 감지해서 특정 사건이 발생하면 해당 이벤트를 발생시킨다. 특정 이벤트에 대해 어떤 일을 하고 싶다면 우리는 브라우저에게 특정 이벤트가 발생 했을 때 호출될 함수를 알려주어 브라우저에게 호출을 위임한다 왜냐하면 우리는 특정 이벤트가 언제 발생할지 알 수 없으므로, 이벤트를 감지할 수 있는 브라우저에게 전적으로 위임하는 것 이벤트 핸들러 : 이벤트가 발생했을 때 호출될 함수 이벤트 핸들러 등록 : 브라우저에게 이벤트 핸들러의 호출을 위임하는 것 이벤트와 이벤트 핸들러를 통해 사용자와 애플리케이션은 상호작용한다 프로그램의 흐름을 이벤트 중심으로 제어하는 프로그.. 더보기
[모던자바스크립트 DeepDive] 42장 비동기 프로그래밍 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. 동기와 비동기 동기 순차적으로 실행하는 것을 의미하며, 현재 실행 중인 태스크가 종료될 때까지 대기하는 방식을 의미한다. 비동기 실행순서와 상관없이 실행하는 것을 의미하며, 현재 실행 중인 태스크가 종료되기 전에 다음 태스크를 실행하는 것을 의미한다. 블로킹과 논블로킹 블로킹 동기처리로 인해서 다음 태스크의 실행이 중지되는 현상 논블로킹 비동기처리로 인해서 다음 태스크의 실행을 바로하는 것 📙 콜 스택 실행 컨텍스트 스택을 의미하며, 현재 실행중인 함수들이 실행 순서대로 들어가서 실제로 실행되게 해주는 자료구조이다. 📙 태스크 큐 비동기 함수의 콜백함수들이 임시적으로 보관되는 영역이다. 📙 이벤트.. 더보기
[모던자바스크립트 DeepDive] 37장 Set과 Map 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. Set Set 객체는 중복되지 않는 유일한 값들의 집합이다. Set 객체는 배열과 유사하지만 차이가 있다. 구분 배열 Set 객체 동일한 값을 중복하여 포함할 수 있다 ⭕️ ❌ 요소 순서에 의미가 있다 ⭕️ ❌ 인덱스로 요소에 접근 할 수 있다. ⭕️ ❌ 📙 Set 객체의 생성 Set 객체는 Set 생성자 함수로 생성한다. 인수를 전달하지 않으면 빈 Set 객체가 생성된다. Set 생성자 함수는 이터러블을 인수로 전달받아 Set 객체를 생성한다. 이때, 이터러블의 중복된 값은 Set 객체에 요소로 저장되지 않는다. const set1 = new Set([1, 2, 3, 3]); console.lo.. 더보기
[Vue.js] 컴포넌트에 대해 HTML -> Vue 로 변환해서 컴포넌트의 이점을 알아보자. 컴포넌트란? 컴포넌트를 왜 사용? 컴포넌트는 어떻게 사용? 컴포넌트 정의 ➜ 컴포넌트 등록 ➜ 컴포넌트 사용 컴포넌트 시스템이란? 컴포넌트 (Component) 자바스크립트에서 재사용할 수 있도록 코드를 분리한 파일을 모듈이라고 한다. Vue 에서도 UI(HTML, CSS, JS) 를 재사용할 수 있도록 정의한 것을 컴포넌트라고 한다. 📌 JavaScript 코드를 재사용하는 모듈과 다르게, 컴포넌트는 JavaScript 뿐만 아니라 HTML, CSS 도 함께 캡슐화하여 재사용이 가능하게 한다. 컴포넌트를 사용하는 이유 컴포넌트를 사용하면 UI를 재사용할 수 있다. ➜ 프론트엔드 개발을 하다보면 JavaScript 뿐만 아니라 HTML, CS.. 더보기

반응형