자바스크립트 기초3

dev·2022년 9월 20일
0

variable

let (ES6에 추가)

let은 재정의 가능

let name = 'yj';
console.log(name);

name = 'hi';
console.log(name)

let과 const는 블록 스코프라서 블록 바깥에서는 접근할수없음
블록 바깥에 let을 정의해놓으면 글로벌 스코프라 어디서든(블록 내부, 외부) 접근 가능
그러나 글로벌 스코프로 만들어둔 변수는 어플리케이션 시작부터 끝까지 메모리에 탑재되어있어서 최소한으로 사용할것(가능하면 class, function, if, for문 등의 내부에 정의하여 내부에서 쓰이고 끝나도록 하는게 좋음)

let globalName = 'black pink';

{
  let name = 'yj';
  console.log(name);//yj
  console.log(globalName);//black pink
}
  console.log(name);//''
  console.log(globalName);//black pink

var (사용 하지말것)

읽기, 쓰기 둘다 가능
var은 변수 선언하기 값을 전에 쓸수가 있음....
선언하기 전에 값을 할당 하고, 그 다음에 선언해도 콘솔 찍어보면 undefined로만 나옴
이는 var의 hoisting 때문인데, var은 어디에 선언을 하건 맨 위로 끌어올려진다(hoisting)
또한 var은 블록 스코프가 없어서 {}안에 선언해도 {}바깥에서 접근 가능함
그래서 큰 규모의 프로젝트 할때 선언하지않은 값들이 할당되거나 하는 문제가 생기기도 함

//var hoisting
console.log(age); //undefined (에러 아님, 아래 코드 계속 출력 된다)
age = 4;
console.log(age); //4
var age;

let은 선언하기 전에 사용하려하면 에러가 나게되고, 블록 스코프라 블록 바깥에서는 접근이 안되게 된다.

console.log(age); //선언하기 전에 접근하려 해서 에러남, 이 아래로 코드는 출력되지 않음)
age = 4;
console.log(age); //4
let age;

그래서 var의 위험성때문에 let을 사용하게 된다.

const

읽기만 가능
constant 는 선언후 한번 값을 할당하고 나면 읽기만 가능해서 재할당을 할수 없게 되어있다.
변수의 값이 계속 변경되어야할 이유가 없다면 let 보다는 const 사용하기

constant 장점
- 보안상의 이유(해커가 값을 변경할수 없음)
- 쓰레드 여러개가 하나의 변수에 접근해 값을 변경할 위험성이 없음
- 나중에 스스로나 다른 개발자가 실수로 값을 변경하지 않도록 할 수 있음

Variable Types

  • primitive, single item : number, string, boolean, null, undefined, symbol...
  • object, box container
  • function, first-class function 이 지원된다는것은 함수를 변수에 할당하고 리턴하는 등을 할 수 있는것

number

java나 파이썬 등 다른 언어에서 float, double, 등등으로 크기에 따라 숫자의 종류가 여러개인데
js에서는 number 하나만 있음.

특별한 숫자의 값

infinity

const inf = 1/0; 
console.log(inf) // infinity

-infinity

const neg = -1/0; 
console.log(neg) // -infinity

NaN

const notN = 'string'/2; 
console.log(notN) // NaN

js로 연산할때 뭔가로 나누기 할때 해당 값이 0인지 아닌지 확인하지 않고 나누기 했을때 위의 세가지 값이 나올수 있음.
그래서 js로 연산할때 반드시 valid한 값인지 확인하고 연산을 해야함

string

const brd = 'brendan';
const greeting = 'hello' + brd;
console.log(greeting);

//템플릿 리터럴스(template literals)
const helloBob = `hi ${brd}!`  
console.log(`value : ${helloBob} , type : ${typeof helloBob}`);// value: hi brendan!, type: string

템플릿 리터럴스를 이용해서 싱글쿼트와 더하기 기호를 써서 하는것보다 깔끔하게 만들수있음

boolean

false
0, null, undefined, NaN, ''

true
그 외 다른 값들(1, string....)

null

텅텅 비어있는 값이라고 할당해준것.

let nothing = null; 
console.log(x); //null값이고, object type

undefined

선언만 해주고 값 할당이 안된경우

let x;
console.log(x); //undefined 값이고 undefined type

symbol

맵이나 다른 자료구조에서 고유 식별자가 필요하거나, 동시다발적 코드에서 우선순위를 주고싶어서 고유한 식별자를 부여하고 싶은경우에 사용한다.
식별자를 같은 'id'라고 해도 둘은 다른 심볼을 가진다.

만약 'id'에 같은 심볼을 가지게 하고싶으면 Symbol1.for('id')라고 하면 된다.
그리고 심볼은 바로 출력되지 않기때문에
console.log(symbol1)하면 에러 발생
console.log(symbol1.description) 하여 string으로 변환해서 출력해야한다.

js는 dynamic typing 언어

변수의 타입을 선언하지 않아도 알아서 타입을 확인
js는 런타임 에러가 발생할수 있음
어떤 변수에 문자열을 넣었다가 숫자를 넣으면 타입이 변경됨(string -> number)
또 string '7'과 number 1을 더하면 string + number이므로 string으로 바꿔서 '71'로 만들어준다.
또한 '8' / '2' 로 string/string을 하면 숫자로 변환해서 4(number)로 바꿔줌..

그래서 처음엔 string으로 쓰다가 누군가 number로 변경한 것을 모른채로

let text = 'hello';
. 
.
.
text = 1;
console.log(text.charAt(0)); //런타임 에러

그래서 타입 스크립트가 생김

Object

여러 타입을 가질 수 있도록 하는 박스

let age = 21; //은 무엇의 나이인지 담을수 없음
const ellie = {name: 'ellie', age: 20} //object타입은 어떤 대상을 표현 가능
ellie.age = 21; //이렇게 변경도 가능(ellie를 향한 포인터는 잠겨있지만 name, age는 잠겨있지 않음)

원시타입은 value로 메모리에 바로 저장된다.
object타입은 object를 가리키는 reference가 저장된다.

immutable / mutable

데이터타입은 immutable / mutable 두가지가 있다.
immutable : 데이터 자체를 절대 변경 불가(원시타입, frozen object...)
mutable : 데이터 변경 가능(object 타입)

profile
hello world!

0개의 댓글