본문 바로가기

FrontEnd

(96)
프로토타입에 대하여 출처: https://poiemaweb.com/js-prototype#42-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EB%A1%9C-%EC%83%9D%EC%84%B1%EB%90%9C-%EA%B0%9D%EC%B2%B4%EC%9D%98-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85-%EC%B2%B4%EC%9D%B8 위글을 다시 복습하면서 유추하면서 읽어야 하는 중요한 사실 정리: 1. 생성자 함수에서 프로토입에 접근할 때는 prototype를 쓰고 그 생성자가 만든 객체에서 프로토타입에 접근 할 때는 __proto__를 사용한다. 생성자 함수.__proto__는 Function.prototype 이다. 2.[[Prototype]]..
왜 프론트앤드 라이브러리/프레임워크를 쓰고 React는 무엇인가 출처: https://velog.io/@gusdh2/React%EB%A5%BC-%EC%82%AC%EC%9A%A9%ED%95%98%EB%8A%94-%EC%9D%B4%EC%9C%A0%EB%8A%94-%EB%AD%98%EA%B9%8C 참고: https://www.youtube.com/watch?v=V3QsSrldHqI&t=333s 리엑트를 사용하는 이유중 하나가 싱글페이지(single page application)를 구현하기 위해서임. 리엑트는 복잡한 웹앱에서의 데이터와 화면의 불일치 문제를 해결해 준다. 따라서 전통적인 웹페이지(예를들면 어떤 정적인 문서를 보여주는 웹페이지)들에 굳이 리엑트를 사용할 필요는 없습니다. 이것이 아직 JQuery같은 프레임워크가 많이 쓰이는 이유입니다. 굳이 모든 웹사이트를 ..
[JavaScript] 전개 연산자 ( Spread Operator ) 출처: https://blog.naver.com/zoz0312/221622159150 전개 연산자는 배열 또는 객체를 하나하나 넘기는 용도로 사용된다. 코드를 통하여 확인하자 const arr = [1,2,3]; let test_arr = [4,5,6]; let test_arr2 = [4,5,6]; test_arr.push(arr); console.log(test_arr); //[4, 5, 6, [1, 2, 3]] //ES6 test_arr2.push(...arr); console.log(test_arr2); //[4, 5, 6, 1, 2, 3] push를 이용할 때 전개 연산자를 사용하지 않은 코드는 array 전체가 들어가 2차원 배열이 되었지만, 전개 연산자를 사용하게 되면 array 내부의 요소 ..
호이스팅과 var과 let의 차이점 그리고 let, const의 블록레벨스코프 출처: https://www.youtube.com/watch?v=F_NgVhvD5Ts&list=PLkNVwwEe58DjbNUHlD_fUOxUWlWYss1DV&index=7 글 일부내용의 출처: https://poiemaweb.com/es6-block-scope 호이스팅이란? var 선언문이나 function 선언문 등 모든 선언문이 해당 Scope의 선두로 옮겨진 것처럼 동작하는 특성을 말한다. 즉, 자바스크립트는 모든 선언문(var, let, const, function, function*, class)이 선언되기 이전에 참조 가능하다. 호이스팅에 의해 스크립트가 로딩되는 시점에 변수의 선언과 초기화를 undefined로 같이 시켜버린다. 값의 할당은 해당 라인에 가서 할당값으로 할당됨.(변수 호이스팅..
템플릿 리터럴: 백틱(``), 달러(${ }) 사용법 출처: https://curryyou.tistory.com/185 정리: 템플릿 리터럴=문자열표기법=문자열 생성시 따옴표 대신 백틱( ` )사용=템플릿 리터럴의 주요사용 문법은 벡틱과 달러연산인거 같다. 템플릿 리터럴의 기능. 1. 줄바꿈(개행) =백틱(`)을 사용하면 쉽게 줄바꿈됨. 2. 표현식 삽입 ${ } 사이에 변수나 연산 등을 삽입할 수 있게 되었다. (자바로 치면 %연산자 같은 거임ex%d, %s등등)
자스의 함수 출처: https://poiemaweb.com/js-function 출처: https://codingfarm.tistory.com/308 자바스크립트의 함수는 객체(일급 객체, First-class object)이다. 다른 객체와 구분될 수 있는 특징은 호출할 수 있다는 것이다. 함수도 객체이므로 다른 값들처럼 사용할 수 있다. 즉, 변수나 객체, 배열 등에 저장할 수 있고 다른 함수에 전달되는 인수로도 사용할 수 있으며 함수의 반환값이 될 수도 있다. 함수를 정의하는 방식은 3가지가 있다. 함수 선언문 함수 표현식 Function 생성자 함수 1.1 함수 선언문 함수 선언문(Function declaration) 방식으로 정의한 함수는 function 키워드와 이하의 내용으로 구성된다. 1.2 함수 표..
리터럴(Literal)이란? 아래 출처의 리터럴에 대한 정의는 잘못되었다. 리터럴은 값, 데이터가 아니라 값을 생성하는 표기방식이다. 상수의 정의 또한 잘못되었다. 상수를 재할당이 금지된 변수다. 아래출처 보지말것. 출처: https://velog.io/@me2designer/%EB%A6%AC%ED%84%B0%EB%9F%B4Literal%EC%9D%B4%EB%9E%80 요약: 리터럴이란 값을 생성하는 표기방식이다. 상수란 변하지 않는 변수이다. 리터럴(Literal)을 알려면 상수(constant)를 같이 알고 둘을 구분할 수 있어야 한다. 상수(constant)란? 재할당이 금지된 변수 상수에 넣는 데이터로는 숫자만 오는 것이 아니라 클래스나 구조체 같은 객체도 올 수 있다. 참조변수를 상수로 지정할 때, 참조변수 안의 속성의 데..
백준(BOJ) 2920: 음계 https://www.acmicpc.net/problem/2920 https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Expressions_and_operators 풀이법중 이해가 되지 않았던 논리 연산자를 사용한 풀이가 있어서 논리 연산자에 관한 아래 사항을 먼저 정리한다. 객체 관련된 아래의 문법도 처음본다. const fs=require('fs'); const filepath=process.platform==='linux'?'dev/stdin':'./input.txt'; let input=fs.readFileSync(filepath).toString().split("\n"); const result = { '1 2 3 4 5 6 7 8': 'as..