분류 전체보기 썸네일형 리스트형 [프로그래머스Lv.1] 짝수와 홀수 (.javascript 풀이) https://school.programmers.co.kr/learn/courses/30/lessons/12937 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [나의 풀이] 기본적인 if 분기문 으로 나누었을 때 나머지가 0이면 짝수, 아니면 홀수 처리 해줌 [다른 풀이] 삼항 연산자로 코드 수 줄임 1이면 true, 0이면 false 더보기 [프로그래머스Lv.1] 평균 구하기 (.javascript 풀이) https://school.programmers.co.kr/learn/courses/30/lessons/12944?language=javascript 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr ## 나는 아주 기본적인 for 반복문으로 더해주는 해결법으로 했는데 다른 사람의 풀이를 보고 감탄 (🔥 es6 이용하자) ## [나의 풀이] [best solution] 참고: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce Array.protot.. 더보기 github 리파지토리 생성 후 vscode 업로드 코딩테스트 준비를 위해 프로그래머스에서 해결하면서 풀이 방법을 vscode 에서 테스트 해보면서 깃허브에 올릴려고 한다. 1. 먼저 github 리파지토리 생성한다 해당 HTTPS 를 복사한 후 2. 터미널을 켜서 연동할 폴더 경로에 들어가서 git clone 복사한 url 3. commit & push 더보기 CORS 위의 사진처럼 웹 개발을 하다보면 가끔 cors 정책 위반으로 인해 에러가 발생하는 경험이 있을거에요 cors error 가 프론트에서 발견하지만 보통 백엔드에서 해결해줘야 하는 에러라고 생각해서 그동안 잘모르고 지나갔었는데요 단순 서버에서의 에러인 줄 았았는데 브라우저의 에러라는 것을 알게 돼서 프론트엔드 개발자라면 cors 에 대해 개념정도는 알아야 하지 않나 싶어서 스터디 하게 되었습니다. 보통 cors 에러가 나타날때 " 다른 출처를 막는게 cors 구나" 라고 생각했었는데 알고보니 다른 출처 요청을 허용해주는게 cors 더라구요 . 한번 제대로 알아봅시다. 자바스크립트에서의 요청은 기본적으로 서로다른 도메인에 대한 요청을 보안상 제한해요. 여기서, 두가지 정책이 있는데 same origin 정책.. 더보기 TDD (Test-Driven Development) 테스트 주도 개발 개발(코드 작성) 전 테스트 코드를 먼저 작성해나가는 방식 TDD 를 하기 위해서는 코드를 구현하기 전에 테스트코드를 먼저 작성한다 이 테스트코드를 실행하고 -> 구현하기 전에 테스트 코드를 먼저 작성했기 때문에 테스트를 실행하면 "실패" 할 것이다 -> 작성된 이 테스트코드가 "성공"할 수 있도록 그 테스트만을 통과할 수 있을만큼만 심플한 코드를 작성한다 -> 성공 그러면 다음 테스트로 넘어가서 이 단계를 반복. 이런식으로 테스트를 먼저 작성하고 전체적인 기능을 구현한다면 이제 그때서야 이미 작성된 코드를 여기저기 수정하고 깨끗하게 만드는 "Refactoring" 작업을 할 수 있다. 리팩토링을 자신감 있게 할 수 있는 이유는 , 구현된 코드를 다 테스트하는 테스트코드가 있기 때문이다.. 더보기 프론트엔드 개발에서 테스트란? ☑️ Software Test 프론트엔드에서 테스트는 중요✧✴︎하다. 제품과 서비스의 품질을 확인하며 소프트웨어의 버그를 찾고 오류를 찾는데 더더욱 필요하기 때문이다. 즉, 서비스(제품)가 예상하는 대로 동작하는지 확인/검증하는 단계 함수, 특정한 기능, UI, 성능, API 스펙 .. 등등을 확인하는 과정 code ➡️ 요구사항 ➡️ TEST 이러한 테스트를 주기적으로 실행해서 Pass or Fail 확인해야 하며, 테스트의 종류 역시 다양하다. 보통 develop -> QA -> Publish 순으로 현업에서 일을 하는데, QA 단계에서 수동적으로 검증하면 시간이 많이 소요되며, 시간이 많이 드니까 검증비용 역시 많이 들게 된다. 여기서 병목현상이 발생해서 문제점이 발생하게 된다. 수동적인 테스팅이 .. 더보기 [모던자바스크립트 DeepDive] 47장 에러 처리 & 48장 모듈 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. 47장 에러 처리 에러 처리의 필요성 에러를 방치하면 프로그램은 강제 종료됨 console.log('start'); // 실행 정의되지않은함수(); // 에러 console.log('end'); // 실행 X try...catch문을 사용하면 강제 종료되지 않는다 console.log('start'); try{ 정의되지않은함수(); } catch(err){ console.error(err); } console.log('end'); // 실행 O 직접적으로 에러를 발생하는 상황 이외에 간접적인 상황도 존재 const element = document.getElementById('없는id'); // .. 더보기 [모던자바스크립트 DeepDive] 46장 제너레이터와 async await 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. 제너레이터 ES6에서 도입되었으며 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수이다. 특징 함수 호출자에게 함수 실행의 제어권을 양도 가능 함수 호출자가 함수 실행을 일시 중지시키거나 재개시킬 수 있다. 함수 호출자와 함수의 상태를 주고받을 수 있다 함수의 호출자와 양방향으로 함수의 상태를 주고받을 수 있다. 제너레이터 함수 호출시, 제너레이터 객체를 반환한다 이터러블이면서 동시에 이터레이터인 객체를 반환 📙 제너레이터 함수의 정의 function 키워드로 선언하며 하나 이상의 yield 표현식을 포함한다. 일관성 유지를 위해 function 키워드 바로 뒤에 붙이.. 더보기 [모던자바스크립트 DeepDive] 45장 Promise 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. 자바스크립트는 비동기 처리를 위한 하나의 패턴으로 콜백 함수를 사용한다. 하지만 전통적인 콜백 패턴은 콜백 헬로 인해 가독성이 나쁘고 비동기 처리 중 발생한 에러의 처치가 곤란하며 여러 개의 비동기 처리를 한번에 처리하는 데도 한계가 있기 때문에 프로미스가 등장하였다. 비동기 처리를 위한 콜백 패턴의 단점 📙 콜백 헬 비동기 함수를 호출하면 함수 내부의 비동기로 동작하는 코드가 완료되지 않았다 해도 기다리지 않고 즉시 종료된다. let a = 0 setTimeout(() => { a = 100 }, 0) console.log(a) // 0 위처럼 비동기 함수 내부의 비동기로 동작하는 코드에서 처리.. 더보기 [모던자바스크립트 DeepDive] 41장. 타이머 & 43장. Ajax 본 글은 자바스크립트 스터디를 진행하면서 [모던자바스크립트 DeepDive] 책을 바탕으로 작성된 글입니다. 호출 스케줄링 일정 시간이 경과된 이후에 호출되도록 함수 호출을 예약하려면 타이머 함수 사용 setTimeout setInterval clearTimeout clearInterval JS 엔진은 싱글 스레드 이기 때문에(단 하나의 실행 컨텍스트) 타이머 함수는 비동기 처리 방식으로 동작한다. 타이머 함수 setTimeout (callback, ms[, params1, ...] 일정 시간 이후에 콜백함수 실행 시간은 밀리초 단위로 사용 clearTimeout(timerId) 즉시 타이머 중지 const timer = setTimeout(() => console.log('Hi!'), 1000); cl.. 더보기 이전 1 ··· 3 4 5 6 7 8 9 10 다음