TIL

Day72

jackpods 2023. 4. 21. 17:33
new Array(rows).fill('');

길이가 rows이고 해당 배열의 요소를 모두 빈 

 

웹 캐시(영어: web cache) 또는 HTTP 캐시(HTTP cache)는 서버 지연을 줄이기 위해 웹 페이지, 이미지, 기타 유형의 웹 멀티미디어 등의 웹 문서들을 임시 저장하기 위한 정보기술이다. 

 

정보기술 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 정보기술(情報技術, 영어: information technology, IT)은 전기 통신, 방송, 컴퓨팅(정보처리, 컴퓨터 네트워크, 컴퓨터 하드웨어, 컴퓨터 소프트웨어, 멀티미디어), 통

ko.wikipedia.org

여러 페이지에서 동일한 스크립트를 사용하는 경우, 브라우저는 페이지가 바뀔 때마다 스크립트를 새로 다운받지 않고 캐시로부터 스크립트를 가져와 사용합니다. 스크립트 파일을 한 번만 다운받으면 되죠.

이를 통해 트래픽이 절약되고 웹 페이지의 실제 속도가 빨라집니다.

 

<script></script> 태그를 만들어서 여기에 자바스크립트 코드를 삽입하는 방식이다. 장점은 html 태그와 js 코드를 분리할 수 있다는 점이다. 

 

코드 구조 -> 코드 블록 만드는 방법 

- statement(문) -> 어떤 작업을 수행하는 문법 구조와 명령어를 의미

-세미콜론 -> 줄 바꿈이 있다면 세미콜론을 생략할 수 있다. 그러나 줄 바꿈으로 문을 나눴더라도, 문 사이엔 세미콜론을 넣는 규칙이다

 

엄격 모드 

1. ECMAScript5(ES5)가 등장하기 전까지 있었던 javascript의 여러가지 불완전한 문법이 기존사이트에 영원히 박제되는 경우가 있었다.
2. 해당사항을 극복하더라도, 호환성 문제를 해결하기위해 엄격모드에서만 해당 변경사항이 활성화 되도록 해놓았다.
3. 'use strict' 는 최상단에 위치시켜야한다. 그리고 취소할 수 없다.
4. 모던자바스크립트에는 class나 import등의 구조가 존재하는데, 이를 사용하면 자동으로 적용이 된다.

 

예약어

예약어(reserved name) 목록에 있는 단어는 변수명으로 사용할 수 없습니다. 이 단어들은 자바스크립트 내부에서 이미 사용 중이기 때문입니다.

예약어 예시: let, class, return, function

아래 코드는 문법 에러를 발생시킵니다.

 

상수

변화하지 않는 변수를 선언할 땐, let 대신 const를 사용합니다.

 

문자형

  1. 큰따옴표: "Hello"
  2. 작은따옴표: 'Hello'
  3. 역 따옴표(백틱, backtick): `Hello`

큰따옴표와 작은따옴표는 ‘기본적인’ 따옴표로, 자바스크립트에서는 이 둘에 차이를 두지 않습니다.

역 따옴표로 변수나 표현식을 감싼 후 ${…}안에 넣어주면, 아래와 같이 원하는 변수나 표현식을 문자열 중간에 손쉽게 넣을 수 있습니다.

 

‘null’ 값

null 값은 지금까지 소개한 자료형 중 어느 자료형에도 속하지 않는 값입니다.

null 값은 오로지 null 값만 포함하는 별도의 자료형을 만듭니다.

null을 ‘존재하지 않는(nothing)’ 값, ‘비어 있는(empty)’ 값, ‘알 수 없는(unknown)’ 

 

undefined

undefined는 '값이 할당되지 않은 상태’를 나타낼 때 사용합니다.

 

객체와 심볼

객체(object)형은 특수한 자료형입니다.

객체형을 제외한 다른 자료형은 문자열이든 숫자든 한 가지만 표현할 수 있기 때문에 원시(primitive) 자료형이라 부릅니다. 반면 객체는 데이터 컬렉션이나 복잡한 개체(entity)를 표현할 수 있습니다

 

 

객체

객체는 중괄호 {…}를 이용해 만들 수 있습니다. 중괄호 안에는 ‘키(key): 값(value)’ 쌍으로 구성된 프로퍼티(property) 를 여러 개 넣을 수 있는데, 엔 문자형, 엔 모든 자료형이 허용됩니다. 프로퍼티 키는 ‘프로퍼티 이름’ 이라고도 부릅니다.

 

중괄호 {...}를 이용해 객체를 선언하는 것을 객체 리터럴(object literal) 

 

리터럴과 프로퍼티

중괄호 {...} 안에는 ‘키: 값’ 쌍으로 구성된 프로퍼티가 들어갑니다.

let user = {     // 객체
  name: "John",  // 키: "name",  값: "John"
  age: 30        // 키: "age", 값: 30
};

 

const user = {
  name: "John"
};

user.name = "Pete"; // (*)

alert(user.name); // Pete

(*)로 표시한 줄에서 오류를 일으키는 것처럼 보일 수 있지만 그렇지 않습니다. const는 user의 값을 고정하지만, 그 내용은 고정하지 않습니다.

const는 user=...를 전체적으로 설정하려고 할 때만 오류가 발생합니다.

 

in’ 연산자로 프로퍼티 존재 여부 확인하기

"key" in object

let user = { name: "John", age: 30 };

alert( "age" in user ); // user.age가 존재하므로 true가 출력됩니다.

alert( "blabla" in user ); // user.blabla는 존재하지 않기 때문에 false가 출력됩니다.

 

let user = { name: "John", age: 30, isAdmin: true };

for (let key in user) { // 키 alert( key ); // name, age, isAdmin

// 키에 해당하는 값

alert( user[key] );

// John, 30, true }

 

-정수 프로퍼티는 순서대로 출력된다. 

 

-객체는 메모리 내 어딘가에 저장되고, 변수 user엔 객체를 '참조’할 수 있는 값이 저장됩니다.

따라서 객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사되고 객체는 복사되지 않습니다.

예시:

let user = { name: "John" };

let admin = user; // 참조값을 복사함

 

-객체 비교 시 동등 연산자 ==와 일치 연산자 ===는 동일하게 동작합니다.

 

- 객체가 할당된 변수를 복사하면 동일한 객체에 대한 참조 값이 하나 더 만들어진다는 걸 배웠습니다.

그런데 객체를 복제하고 싶다면 어떻게 해야 할까요? 기존에 있던 객체와 똑같으면서 독립적인 객체를 만들고 싶다면 말이죠.

방법은 있는데 자바스크립트는 객체 복제 내장 메서드를 지원하지 않기 때문에 조금 어렵습니다. 사실 객체를 복제해야 할 일은 거의 없습니다. 참조에 의한 복사로 해결 가능한 일이 대다수이죠.

 

let user = {

name: "John", age: 30

};

let clone = {};// 새로운 빈 객체

 

// 빈 객체에 user 프로퍼티 전부를 복사해 넣습니다.

for (let key in user) {

     clone[key] = user[key];

}

// 이제 clone은 완전히 독립적인 복제본이 되었습니다.

clone.name = "Pete"; // clone의 데이터를 변경합니다.

 

alert( user.name ); // 기존 객체에는 여전히 John이 있습니다.