본문 바로가기

전체 글

 (94)
클래스 분리 전 공부 사항 이번 미션에서 필요할 것 같은 부분만 정리 클래스 생성시 반드시 'new'를 붙여 생성합니다. 클래스는 파스칼케이스 (PascalCase) constructor는 생성 및 초기화를 할 수 있습니다. 덧붙여 constructor 안에선 return문 써선 안됩니다. 여기서 static # 같은 글자를 baseball 미션 피어리뷰하면서 종종보고, 심지어 #은 이번 lotto미션에 등장하는데, 이것이 무엇이냐면, static은 정적메소드 즉 new 없이 사용 가능합니다. #은 그 유명한 private. 한줄씩으로 얘기하자면 정적 메서드는 특정 클래스 인스턴스가 아닌 클래스 '전체’에 필요한 기능을 만들 때 사용. private는 함수도 클래스 내부에서만 사용할거면 사용. 외부에서도 호출할거면 public. ..
[짧] apply에 관해.. 문제를 풀고 다른 사람이 작성한 답을 보다가 헷갈리는 부분이 있어 포스팅합니다. TIP ) [...Array(5).keys()]; // range(5) let tube1 = Array.apply(null, Array(t)); let tube2 = Array(t).fill(undefined); let tube3 = Array(t) console.log(tube1) // [undefined x t] console.log(tube3 // [undefined x t] console.log(tube3) // [empty x t] tube1과 tube2는 동일하게 undefined로 채워집니다. https://school.programmers.co.kr/learn/courses/30/lessons/17687 해당 ..
URL과 URI URL은 URI의 하위 집합이다. URI는 특정 리소스를 식별하는 통합 식별자로, 논리적 물리적 리소스를 구별하는 고유 문자열 시퀀스이다. URL은 URI의 서브 셋 으로, 특정 리소스의 주소를 가리킨다. 즉 URI는 식별하고 URL은 위치를 가리킨다. 그림 참고 : 1학기 과목 정리 - 1편 - https://jiho1996.tistory.com/m/98 예시를 가져왔다. http://torang.co.kr/user/107 이는 유저들 중에서 107번 즉 /user 까지는 주소를 가리키는 URL이자 URI 107은 유저들 중 107번째 유저를 식별하고 있기에 URI이다. 다른예시 하나를 들어본다. http://torang.co.kr/index 이는 torang.co.kr의 index파일을 가리킨다. 하..
SSR vs CSR , SEO문제 해결 이번 포스팅은 SSR과 CSR, 그리고 이를 통해 SEO문제를 어떻게 해결하는지 정리하고자 한다. 먼저 SSR과 CSR. 간단하게 말하면 HTML파일을 어디서 받아오는가의 차이 이다. SSR은 서버 사이드 렌더링 즉 이름에서도 알 수 있듯이 HTML 렌더링 위치가 서버. CSR은 클라이언트 사이드 렌더링 즉 클라이언트 쪽에서 HTML 렌더링이 된다. * 여기서 렌더링의 의미는 조금 얕게 보자. 원래라면 HTML CSS JS파일을 가져와서 파싱하고 paint하는 작업이라면 여기서는 HTML 내용이 있는 채로 주고 있는 것인가? 로 해석하자. 단계를 살펴보면 1 SSR 서버가 브라우저의 요청에, 렌더링된 HTML을 응답한다 -> 브라우저는 이 렌더링된 HTML을 viewable하게 만든다 동시에 JS 파일 ..
HTTP & HTTPS HTTP란 Hyper Text Transfer Protocol 즉, 하이퍼텍스트 전송 규약이다. 데이터를 주고 받음에 있어 약속된 형식이다. 'ㅇ'를 보고 이게 0인지 이응인지 알파벳 O인지 구분 해야하듯이 HTTP로 그 형식을 구분한다. HTTPS의 S는 Secure약자 이다. 여기서 알 수 있듯이, 일반적으로 HTTP 프로토콜의 문제점은 서버로부터 브라우저로 전송되는 정보가 암호화 되지 않는다는 점이 있다. 이 말은 쉽게 정보가 노출될 수 있다는 의미이다. 또한 접속하는 서버가 진짜 해당 서버인지 검증을 하는 방법이 없다. 그렇기에 HTTPS 프로토콜은 SSL(보안 소켓 계층)을 사용함으로써 보안을 유지할 수 있게 되었다. 또한 먼저 간단하게 언급하자면, HTTP는 해당 사이트가 믿을 만한 사이트인지..
[클린코드 자바스크립트] 함수 함수 인자를 던져줄 때, 객체 구조분해로 넘길 수있다. 여기서 조금더 안전하게 쓰기 위해선 그 인자값이 비어있다면 throw를 던져주어도 좋다. 위 사진은 required 함수를 따로 선언하여 필수인 요소들을 기입하지 않는다면 throw 예외를 주는 코드이다. 기본값 사용하기 => || 또는 ?? 써도 좋다. (앞선 포스팅서 다룸) 또는 = 로 넣을 수도 있다. const func = function ( {name = "" , age = 0 , height = 0 } = {} ) { ...some logic } // 기본값이 각각 "", 0, 0 으로 기입. // 아예 아무것도 기입하지 않는다면 빈객체가 인자의 기본 값이 된다.0
[클린코드 자바스크립트] 배열 및 객체 shorthand property const person = { getFullName : funtion(){...} } const person ={ getFullName (){...} } 위의 getFullName프로퍼티나 아래 getFullName프로퍼티나 같다. 즉 shorthand property를 쓰고 있음을 인지하기 let result = score >= 50 ? "pass" : "fail"; 조건 ? true일때 피연산자 : false일때 피연산자 좌항프로퍼티?.우항프로퍼티 좌항프로퍼티가 falsy값(null undefined 외)이면 우항프로퍼티 참조 null undefined시 우항 프로퍼티 참조하지 않음. 좌항 ?? 우항 좌항이 null 또는 undefined시 우항 반환. let res..
Executive Context 자바스크립트에서 실행 컨텍스트는 세가지로 나뉜다. 1. global 2. functional 3. eval global execution context JS코드 실행시에 생성되며 무조건 하나만 갖는다. functional execution context는 함수 호출을 할때마다 스택에 쌓이며, 여러개 갖을 수 있다. eval은 나오는 경우가 드물고, 사용해본 적 없기에 후에 다루겠습니다. 실행 컨텍스트는 후입 선출 구조로 스택에 쌓입니다. 스크립트 생명 주기 동안 모든 실행 스택을 저장하기 위함입니다. 자바스크립트 엔진은 두가지 단계로 실행컨텍스트를 만듭니다. 이는 전에 이야기한 호이스팅과 관련이있습니다. 1. Creation 단계 2. Execution 단계 1. Creation 단계에서는 다음의 세 과..

티스토리툴바