JavaScript

드림코딩 : JS - 3. data type, let vs var, hosting

식초 2020. 10. 16. 10:04
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
//1.Use strict
//added in ES 5
//use this for Valina Javascript   
'use strict';
 
 
//2. Variable(변수), rw(read/write)
//let (added in ES6)
 
let globalName = 'global name'
//global scope : 어디서나 보인다
{
    let name = 'sigcho'//name 선언, 값 할당
    console.log(name);
    name = 'hello'//값 다시 할당, mutable
    console.log(name); //hello로 변경되서 나온다
    console.log(globalName); 
}
//block scope : 블록 밖에서는 못본다.
console.log(name); // 값이 안나온다.
console.log(globalName);
 
//var (이제 쓰지 말기!)
//var hoisting (어디에 선언했는지 상관없이, 선언을 가장 위로 끌어올림)
console.log(age); //값 할당 전에 출력 가능
age = 4// 값 선언 전에 할당 가능
var age = 4// 값 선언
 
name = 4//에러가 뜬다! (이것이 정상)
let name;
 
{
    age = 4;
    var age;  //블록을 철저히 무시한다, 유연성이 있으나, 프로젝트 진행하면 선언하지도 않은 변수 나타나서 힘듬
}
console.log(age); //밖에서 콘솔 출력 가능
 
 
//3. Constant, r(read only) 
//use const whenever possible
//only use let if variable needs to change
const daysInWeek = 7;
const maxNumber = 5;
//Note!
//Immutable data types: premitive types(데이터 자체 변경 불가), frozen objects
//Mutable data types: all objects by default are mutable in JS(객체는 기본적으로 변경 가능)
// favor immutable data type always for a few reasons;(값 한번 할당하면 절대 바뀌지 않는다)
// -security  보안
// -thread safety   스레드 보안
// -reduce human mistakes  실수 방지
 
 
//4. Variable types
//primitive 타입 : single item | 값 자체가 저장 | 종류 : number, string, boolean, null, undefined, symbol
//object 타입 : box container | ref 저장(잠금) 내용은 변경 가능 | 종류 : function, first-class function(=함수도 변수에 할당 가능, 함수 return type된다 등)
 
const count = 17// 정수, 타입 number
const size = 17.1// 소숫점, 타입 number
console.log(`value: ${count}, type: ${typeof count}`);
console.log(`value: ${size}, type: ${typeof size}`);
 
//number - 특별한 숫자 값 (연산할 때 값이 variable한 것인지 알고 연산하지 않으면 에러)
const infinity = 1/0;  //양의 무한대
const negativeInfinity = -1/0;  //음의 무한대
const nAn = 'not a number'/2;  //string 값을 숫자로 나누면 = nAn
console.log(infinity);
console.log(negativeInfinity);
console.log(nAn);
 
//bigInt - 거의 쓰진 않지만 최근 추가된 것, 크롬에서만 쓰임
const bigInt = 123434545385982734947238489n; // over(-2의 53승~ 2의 53승), 숫자 뒤에 n만 붙이면 bigInt로 간주됨
 
//string
const char = 'c';  //한가지 글자도 string 타입 할당
const brendan = 'brendab';  //여러 글자도 string 타입 할당
const greeting = 'hello' + brendan;  //일반 string과 다른 변수도 string으로 붙임가능
const helloBob = `hi ${brendan}!`;  //template string(literals), ``기호 사이에 ${}넣고 {}안에 변수 넣으면 값 출력된다
console.log(`value: ${helloBob}, type: ${typeof helloBob}`);  //띄어쓰기도 그대로 나온다, +안써도 된다
console.log('value' +helloBob+ 'type: ' +typeof helloBob);  //윗줄과 같은 의미, 불편함
 
//boolean
//false: 0, null, undefined, NaN, ''
//true: any other value
const canRead = true//바로 true 나올 수도 있음
const test = 3<1;  //평가한 뒤에 false 나올 수도 있음
 
//null (텅텅 비어있는 값)
let nothing = null;  //null 지정해준다
 
//undefined (값이 정해지지 않음, 비었는지 있는지 조차도)
let x = undefined;  // 직접 지정 가능
let x;  //이 경우도 undefined
 
//symbol (자료구조 등에서, 고유한 식별자 필요, 동시다발적으로 일어나는 일에서 우선순위)
const symbol1 = Symbol('id');
const symbol2 = Symbol('id');
console.log(symbol === symbol2);  //결과는 false, 다르다고 나온다
const gSymbol1 = Symbol.for('id');  //string이 똑같고 동일한 symbol을 만들고 싶다
const gSymbol2 = Symbol.for('id');
console.log(gSymbol1 === gSymbol2);  //true
console.log(`value: ${symbol.description}, type: ${typeof symbol1}`); //.description을 붙여서 string타입으로 바꿔서 출력해야 한다
 
//object (물건 대표하는 박스형태)
const sigcho = {name:'sigcho', age:26
sigcho.age =26;
 
 
//5. Dynamic typing: 선언할 때 타입 결정X, 동작할 때 할당된 값에 따라 값 변한다
let text ='hello';
console.log(text.charAt(0));  //첫번째 캐릭터 받아옴, hello의 h출력
console.log(`value: ${text}, type: ${typeof text}`); //string 타입
text =1//다시 할당
console.log(`value: ${text}, type: ${typeof text}`); //number 타입
text = '7' +5;
console.log(`value: ${text}, type: ${typeof text}`); //string, 75값
text = '8'/'2';
console.log(`value: ${text}, type: ${typeof text}`); //number, 4값
console.log(text.charAt(0));  // string인줄 알고 출력했는데 number로 중간에 바꿔서 오류뜸!
//TypeScript 등장..
cs