Languages/Javascript

Prototype이란? JS에서 객체를 만들기 위해 사용하는 객체 ( Prototype : 근원, 근원이 되는 ) Prototype을 만든 이유 Javascript는 클래스 개념이 없다. 그래서 기존의 객체(Prototype)를 참조해, 새로운 객체를 만드는 방식을 사용한다. 기본 Prototype 생김새 ( 최상위 객체 - 프로토타입이 없는 객체 ) const Object = { constructor: ƒ Object() // 자식 객체 만들때 사용하는 함수 hasOwnProperty: ƒ hasOwnProperty() isPrototypeOf: ƒ isPrototypeOf() propertyIsEnumerable: ƒ propertyIsEnumerable() toLocaleString: ƒ toLoc..

정적 메소드란? javascript에서 공용적으로 자주 사용하는 기능을, 미리 객체로 만들어 놓은것. - Math, Random, Boolean 등등 ... 정적 메소드의 특징 정적 메소드는, 콜이나 순서에 상관없이 처음부터 메모리를 할당받는다. 메소드와 프로퍼티가 이미 다 만들어져 있기때문에 constructor가 없고, 내가 따로 만들 수 없다.

setTImeout() 일정 시간뒤에, 함수를 호출할 수 있도록 해주는 함수. setTImeout(함수, 시간초) // ms 단위, 1000 = 1초 setInterval() 일정 시간간격으로, 함수를 호출할 수 있도록 해주는 함수. setInterval(함수, 시간초)

Pug란? javascript를 사용하여, HTML을 렌더링해주는 템플릿 엔진 Pug 설치 npm i pug Pug 작성법 html에서 기호가 제외된다. 요소와 같은 줄에 있는 것을 태그로 감싼다. 태그에 속성을 넣을때 괄호()를 사용한다. - 태그(속성=값) 태그뒤에 .을 붙혀 클래스를 추가할 수 있다 - 태그 .class 태그뒤에 #을 붙혀 id를 추가할 수 있다 - 태그 #id 들여쓰기로 부모요소와 자식요소를 나눈다. Pug와 express 연결 // src/app.js app.set('views', path.join(__dirname, 'views'); app.set('view engine', 'pug'); // src/views/home.pug doctype html html(lang="en")..

Navigator 객체란? 브라우저 공급자, 버전정보 등의 다양한 정보를 저장하는 객체 필요한 요소들을 간단하게 테스트하는 기능을 제공한다 Navigator 객체 사용하기 현재 브라우저가 실행되고 있는 운영체제 확인하기 console.log(navigator.platform) 현재 브라우저의 기본 언어 확인하기 console.log(navigator.language) 쿠키(cookie)를 사용가능 한지 확인하기 if(navigator.cookieEnabled) { console.log("쿠키 사용 가능") } else { console.log("쿠키 사용 불가") }

Fetch API란? HTTP의 GET, POST, PUT, DELETE같은 메소드를, 사용할 수 있도록 해주는 javascript API ( Promise 객체를 반환한다. ) Fetch 특징 1. fetch()로 부터 반환되는 Promise 객체는, HTTP error 상태를 reject 하지 않는다. ( HTTP Statue Code가 404나 500을 반환하더라도 ) 대신 ok 상태가 false인 resolve가 반환되며, 네트워크 장애나 요청이 완료되지 못한 상태에서 reject가 반환된다. 2. fetch()는 쿠키를 보내거나 받지 않는다. 사이트에서 사용자 세션을 유지 관리해야하는 경우, 인증되지 않는 요청이 발생 쿠키를 전송하기 위해서는 자격증명(credentials) 옵션을 반드시 설정해..

기본 Array 형식 // array 만들기 const array = [1, 2, 3, 4, 5] array.slice() // slice()로 특정 부분 자르기 array.slice(0,4) // 결과 : array = [1, 2, 3, 4] array.map() // map()으로 Arrap 요소 하나하나에 함수 적용하기 - 인덱스로 배열 순서 확인 가능 array.map((element, index) => { console.log(index, " : ", element) }) /* 결과 ( 콘솔창 ) 0 : 1 1 : 2 2 : 3 3 : 4 4 : 5 */

1. Nullish Coalescing Operator ( 널리쉬 콜싱 오퍼레이터 ) function printMessage(text) { const data = text ?? "is Nothing"; console.log(data) } // text="View" 일때 View // text가 없을때 ( undefined ) is Nothing // text가 null 일때 is Nothing 2. Default Parameters ( 디폴트 파라미터 ) function printMessage(text = "is Nothing"){ console.log(text) } // text="View" 일때 View // text가 없을때 ( undefined ) is Nothing // text가 null 일때..

fs란? FileSystem의 약자로, 파일 처리와 관련된 여러가지 기능을 하는 js라이브러리 기능 설명 1. 파일 읽기 import fs from "fs"; // 파일 읽기 - "filename"에 파일 경로를 입력해줍니다 fs.readFile("filename", [options], callback); // "filename" 파일을, [options]을 적용해 읽은후, callback 함수를 실행! fs.readFileSync("finename", [options]); // "filename"파일을, [options]을 적용해 읽은후, 문자열 반환 // Sync : 동기적 읽기를 뜻함 ( 한 작업을 마치기 전까지, 다른 작업 불가 ) 2. 파일 쓰기 import fs from "fs"; // 파일 ..