본문 바로가기

전체 글

 (154)
모던 자바스크립트 Deep Dive 3장 : 자바스크립트 개발 환경과 실행 방법 자바스크립트 실행환경 Broswer와 Node.js 크게 두 가지 환경이 있으나, 둘이 제공하는 기능이 다르다. Browser - EMCAScript 실행, DOM API 제공, Client Side API 제공 Node.js - EMCAScript 실행, File System 제공, Node.js 고유 API 제공 ※ Node.js에서는 cheerio 같은 HTML Parsing 라이브러리를 이용하여, Node에서도 DOM 가공이 가능 ※ Browser에서 File System이 제공될 시, 악성 JS파일이 브라우저를 통해 사용자의 컴퓨터를 쓰고 지울 수 있게된다. 즉, 해킹할 수 있다는 것이 된다. 그래서 제공하지 않고, FileReader API까지만 제공한다.. Browser(Chrome 기준) ..
에라토스테네스의 체 정의 그리스의 수학자이자 지리학자인 에라토스테네스가 고안한 소수(素數)를 찾는 방법으로, 이 방법으로 소수를 찾으려면, 2부터 시작해 자연수를 차례로 쓴 다음, 2 이외의 2의 배수, 3 이외의 3의 배수, 5 이외의 5의 배수의 순서로 수를 지워나가 끝에 남는 수가 소수이다. 아이디어 1. 0-n까지 들어있는 배열을 만든다. 여기서 소수가 아닌 숫자는 모두 0이 될 것이다. 2. 1을 0으로 만든다. (1은 소수가 아니므로 처리한다.) 3. 반복문을 돌리면서 만약 해당 숫자가 살아 있다면, 그 숫자는 소수이다. 그리고 그 숫자의 n배는 소수가 아니므로 0으로 바꾼다. 4. 마지막에 filter를 이용하여 0을 제거하면 소수만 모여있는 배열이 남는다. 구현 function solution(n){ // 1..
[js] Programmers_Lv.0_소인수분해 문제 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 자연수 n의 소인수를 담은 배열을 오름차순으로 반환하시오 아이디어 1. 에라토스테네스의 체를 이용하여 소수를 구하자. 2. n을 소수들로 나누어서 나누어지면 answer 배열에 추가한다 ( 한 번이라도 나누어진다 = 소인수) 구현(풀이) function solution(n) { var sieve = [] var answer = [] // 1. 에라토스테너스의 체 구현 for (var i=0; i< n+1; i++) { sieve.push(i) } sieve[1] = 0 for (var i=2; i< n+..
[js] Programmers_Lv.0_인덱스 바꾸기 문제 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문자열(my_string)과 정수(num1, num2) 두 개가 주어질 때, 문자열의 index(num1, num2)에 해당하는 문자열을 교체한 값을 반환하시오 아이디어 1. 먼저 각 문자를 상수로 저장한다. 2. 반복문을 돌려서 문자열을 완성한다. 이 때, num1 ,num2에 해당할 시, 다른 변수를 추가하는 if문을 작성한다. 구현(풀이) function solution(my_string, num1, num2) { var answer = ''; const first = my_string[num1] ..
[js] Programmers_Lv.0_자릿수 더하기 문제 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 주어진 숫자의 각 자릿 수를 더해라. 아이디어 1. 주어진 숫자를 문자열로 만들어서 반복문을 돌리자. 2. 그리고 해당 문자열을 다시 숫자로 치환해서 answer에 합하자 구현(풀이) function solution(n) { const stringNumber = n.toString() var answer = 0; for (var i=0; i< stringNumber.length; i++ ){ answer += parseInt(stringNumber[i],10) } return answer; } 남의 풀이..
모던 자바스크립트 Deep Dive 2장 : 자바스크립트란? 표준화된 자바스크립트 (ECMA)의 변화과정 1995년 : 웹페이지의 보조적인 기능 수행을 위해서 브라우저에서 동작하는 경량 프로그래밍 언어(JS 초기 버전) 도입 1996년 : 브라우저 간 경쟁으로 크로스 브라우징 이슈 발생. 표준화된 언어 개발 착수 1997년 : ECMA-262 표준화된 자바스크립트 초판(ECMAScript1) 발행 2009년 : ECMASciprt5(ES5)가 HTML5와 함께 출시 2015년 : ECMASciprt6(ES6)가 let/const 키워드, 화살표 함수, 클래스, 모듈 등과 같은 범용 프로그래밍 언어로서 갖춰야할 대규모 기능이 도입 2015~ : 지속적으로 매년 소규모 업데이트 진행 성장의 역사 시작 (1995년) - HTML +CSS를 서버로부터 받아서 렌더링하는 ..
모던 자바스크립트 Deep Dive 1장 : 프로그래밍 프로그래밍 실행을 요구하는 컴퓨터와의 커뮤니케이션을 의미한다. 프로그래밍은 크게 요구사항과 문제 해결 능력 두 가지를 요구한다. 요구사항 : 인간과 다르게 컴퓨터가 이해할 수 있을 정도로 정확하고 상세하게 요구사항을 설명하는 작업이 필요하다. 즉, 수치화 등의 Computing thinking을 요구한다. 문제 해결 능력 : 이해한 요구사항을 절차에 맞게 해결하는 방안이다. 이 부분은 오히려 직감과 직관의 영역이라 볼 수 있다. 프로그래밍 언어 언어는 문법과 문장의 구성도 중요하지만, 결국 그 안에 담긴 의미가 핵심인 것이다. 프로그래밍 언어도 마찬가지다. 구문과 의미의 조합으로 이루어지며 의미가 중요하다. 즉, 위 내용과 결합하면 구문(문법)에 맞게 의미(요구 사항)을 실현해야한다.(문제 해결) 결국,..
[CSS] ::before ::after :: beforeIn CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default. element에 첫 번째 자식 요소(element) 인 pseudo-element를 만듭니다. 인라인이 디폴트로, 요소에 외관 요소를 추가하고자 할 때, 주로 사용됩니다. ※ pseudo-element : Html 요소의 특정 부분만을 선택하기 위한 요소입니다.   이 사진처럼, a tag 앞에 클립모양이나 커마 등의 문장 부호를 추가할 때..

티스토리툴바