hoon's bLog

9장 외부 데이터에 접근하라 저번 포스팅과 마찬가지로, 개념적으로 부족한 부분이 많아 기본 개념과 설명이 많고, 예제 코드도 책이 아닌 직접 코딩을 해서 설명을 풀어보겠다. tip45. fetch로 간단한 AJAX 호출을 처리하라 fetch() API HTTP 파이프라인을 구성하는 요청과 응답 등의 요소를 JavaScript에서 접근하고 조작할 수 있는 인터페이스를 제공 Fetch API가 제공하는 전역 fetch() 메서드로 네트워크의 리소스를 쉽게 비동기적으로 취득 가능 fetch() : 특정 정보가 필요한 클라이언트는 서버에 HTTP 통신으로 요청(request)을 보내고, 정보를 응답(response)받을 수 있다. fetch()는 대부분의 최신 브라우저에서 지원되지만 Node.js에서는 기본적으..

9장 외부 데이터에 접근하라 이번 포스팅에서는 Promise라는 개념과 async/await에 대해서 알아볼 텐데, 개념적으로 부족한 부분이 많아 기본 개념과 설명이 많고, 예제 코드도 책이 아닌 내가 직접 코딩을 해서 설명을 풀어보겠다. 이번 장을 이해하기 위해서는 비동기 방식과 콜백함수가 선행되어야 한다. (추후 비동기와 콜백함수에 대해서 포스팅 예정) tip43. 프라미스를 이용해 비동기적으로 데이터를 가져오라 프라미스(Promise) 자바스크립트 비동기 처리에 사용되는 객체로, 비동기 작업을 전달받아서 응답에 따라 두 가지 메서드 중 하나를 호출하는 객체이다. 비동기 작업이 성공하거나 충족된 경우 then() 메서드에 결과를 넘겨준다. 비동기 작업이 실패하거나 거부되는 경우에는 Promise가 c..

문제출처 : https://school.programmers.co.kr/learn/courses/30/lessons/77885 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [문제 설명] [문제 풀기 전 생각/정리] 이진 문자열을 생성하는 Long.toBinaryString() 메서드를 이용하여 조건문을 통해 연산하는 과정이 필요할 것으로 예상 [나의 풀이] class Solution { public long[] solution(long[] numbers) { long[] answer = new long[numbers.length]; for(int i=0..

문제출처 : https://school.programmers.co.kr/learn/courses/30/lessons/76502 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [문제] [문제 풀기 전 생각/정리] 문제는 회전이라고 표현했는데 설명에서는 왼쪽으로 이동하고 맨 첫 번째에 있었던 괄호는 오른쪽 끝으로 이동한다. 이동하는 모습을 보고 Stack을 사용해야 겠다는 생각이 들었다!! 특별히 규칙이 없어 보여 switch-case 문으로 괄호별 case를 구분해야겠다! [나의 풀이] import java.util.Stack; class Solution ..

8장 클래스로 인터페이스를 간결하게 유지하라 tip40. get과 set으로 인터페이스를 단순하게 만들어라 이전 팁에서 사용한 코드를 활용하여, 클래스는 아래 코드처럼 속성에 접근하여 변경도 가능하다. class Coupon { constructor(price, expiration) { this.price = price; this.expiration = expiration || '2주'; } getPriceText() { return `$ ${this.price}`; } getExpirationMessage() { return `이 쿠폰은 ${this.expiration} 후에 만료됩니다.`; } } const coupon = new Coupon(5); coupon.price = '$10'; coupon..

8장 클래스로 인터페이스를 간결하게 유지하라 tip37. 읽기 쉬운 클래스를 만들어라 우선 자바스크립트에서 클래스를 작성하는 방법을 살펴보자. class Coupon { constructor(price, expiration) { this.price = price; this.expiration = expiration || "2주"; } } const coupon = new Coupon(); coupon.price; // undefined coupon["expiration"]; // 2주 class : 클래스를 선언 클래스는 일반적인 JavaScript 함수일 뿐이며 클래스 구문을 사용하지 않고 완전히 복제 가능하여, 복잡한 객체를 보다 쉽게 선언하고 상속 할 수 있도록 한다! new : 새로운 인스턴스 생..

문제출처 : https://school.programmers.co.kr/learn/courses/30/lessons/42578 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [문제 설명] 코니는 매일 다른 옷을 조합하여 입는 것을 좋아합니다. 예를 들어 코니가 가진 옷이 아래와 같고, 오늘 코니가 동그란 안경, 긴 코트, 파란색 티셔츠를 입었다면 다음날은 청바지를 추가로 입거나 동그란 안경 대신 검정 선글라스를 착용하거나 해야 합니다. 코니는 각 종류별로 최대 1가지 의상만 착용할 수 있습니다. 예를 들어 위 예시의 경우 동그란 안경과 검정 선글라스를 동..

문제출처 : https://school.programmers.co.kr/learn/courses/30/lessons/68936 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [문제 설명] 0과 1로 이루어진 2n x 2n 크기의 2차원 정수 배열 arr이 있습니다. 당신은 이 arr을 쿼드 트리와 같은 방식으로 압축하고자 합니다. 구체적인 방식은 다음과 같습니다. 당신이 압축하고자 하는 특정 영역을 S라고 정의합니다. 만약 S 내부에 있는 모든 수가 같은 값이라면, S를 해당 수 하나로 압축시킵니다. 그렇지 않다면, S를 정확히 4개의 균일한 정사각형 영..

7장 유연한 함수를 만들어라 tip34. 부분 적용 함수로 단일 책임 매개변수를 관리하라 고차 함수를 이용해 매개변수에 단일 책임을 부여하는 방법을 살펴보자. 고차 함수(Higher-Order Function) 함수를 파라미터로 전달받거나 연산의 결과로 반환해주는 메서드 다른 함수를 반환하므로 최소 2단계의 매개변수가 존재 자주 거론되는 함수형 프로그래밍의 핵심이기도 하며, 자바스크립트를 함수형 프로그래밍에 알맞은 언어로 만들어주는 특성 함수형 프로그래밍 : 함수형 프로그래밍은 함수를 다른 함수의 파라미터로 넘길 수도 있고 반환(return) 값으로 함수를 받을 수도 있는 프로그래밍 형태 웹사이트에 행사 안내 페이지가 있다고 가정하자. 아래 코드를 통해 살펴보자. 장소, 건물(building), 관리자(..

7장 유연한 함수를 만들어라 tip32. 테스트하기 쉬운 함수를 작성하라 코드를 쉽게 리팩토링 가능 오래된 코드를 쉽게 이해 가능 마지막으로 명확하고 버그가 적은 코드를 작성 가능 너무 당연한 말이 아닐까 싶지만, 현실은 테스트 코드를 작성하는 것 조차 쉽지 않다. (테스트 작성의 어려움, 코드가 외부 의존성이 강하게 결합, 개발속도가 느림 등...) import { getTaxInformation } from './taxService'; function formatPrice(user, { price, location }) { const rate = getTaxInformation(location); // const taxes = rate ? `추가 세금 $${price * rate}` : '추가 세금'..