728x90
global let , let(mutable data type)
// 2.Variable
let globalName='global name';
{
let name='duduri';
console.log(name); // duduri
name='hello';
console.log(name); // hello
}
console.log(name); //
console.log(globalName); // global name
globalName = 전역변수 ( 애플리케이션이 끝날때까지 메모리에 저장되어있다)
{ .. } 블럭밖에서 name 접근할 경우 값이 안나온다 (블록스코프)
{ .. } 블럭밖에서 globalName 접근할 경우 값이 나온다
var 를 지양하자 (호이스팅)
{
age=4;
var age;
}
console.log(age); // 4
1. var는 선언하기도 전에 쓸수 있어 위험하다 (var hoisting)
2. 호이스팅 : 선언된값을 위로 끌어온다
3. 블록스코프 {} 를 무시한다
4. 프로젝트가 커질수록 선언되지않은 값이 할당될경우 위험하다
const (immutable data type)
// 한번 설정되면 값이 변하지 않는다
// 왠만하면 설정하고 값이 변하지않는걸로 사용한다
const daysInWeek=7;
const maxNumber=5;
1. 보안성을 보장해준다
2. 동시에 값 변경을 막아준다
3. 실수를 줄여준다
variable types
primitive 타입 더이상 작은걸로 나누어 지지않는다
1. single item: number , string , boolean , null , symbol
2. object타입 한박스 단위로 나누어준다
3. function()
number
const count=14; // integer
const size=14.1; // decimal number
console.log(`value : ${count},type:${typeof count}`); // 14, number
console.log(`value : ${size},type:${typeof size}`); // 14.1, number
Infinity, -Infinity
// 무한대 숫자 Infinity
const infinity=1/0;
// -Infinity
const negativeInfinity=-1/0;
// 숫자가 아닌값을 출력할때는 NaN으로 출력
const nAn='not a number' / 2;
console.log(infinity); // Infinity
console.log(negativeInfinity); // -Infinity
console.log(nAn); // NaN
bigInt
const bigInt=123456789456123123456789789456123n;
console.log(`vale: ${bigInt} , type:${typeof bigInt}`); // ..., bigint
string
const char='c';
const brendan='brendan';
const greeting='hello' +brendan;
const helloBob=`hi ${brendan}!`;
console.log(`value : ${greeting} , type : ${typeof greeting}`); // hello brendan, string
console.log(`value : ${helloBob},type : ${typeof helloBob}`); // hi brendan, string
console.log(`value:` + helloBob + 'type:' + typeof helloBob); // hi brendan, string
boolean
// fale: 0,null,undefined,NaN,''
// true: any other value
const canRead=true;
const test=3<1; //false
console.log(`value: ${canRead}, type: ${typeof canRead}`);// true, boolean
console.log(`value:${test}, type: ${typeof test}`);// false, boolean
null
let nothing=null;
console.log(`value: ${nothing}, type:${typeof nothing}`);// null, object
undefined (선언되었지만 값은 없다)
let x;
console.log(`value: ${x}, type: ${typeof x}`);// undefined, undefined
symbol
const symbol1=Symbol('id');
const symbol2=Symbol('id');
console.log(symbol1===symbol2); //false
const gSymbol1=Symbol.for('id');
const gSymbol2=Symbol.for('id');
console.log(gSymbol1===gSymbol2); //true
console.log(`value ${symbol2.description}, type:${typeof symbol2}`) //id, symbol
Dynamic typing
let text='hello';
console.log(text.charAt(0)); //h
console.log(`value: ${text}, type: ${typeof text}`); // hello, string
text=1;
console.log(`value: ${text}, type: ${typeof text}`); // 1, number
text='7'+5;
console.log(`value: ${text}, type: ${typeof text}`); // 75, string
text='8'/'2';
console.log(`value: ${text}, type: ${typeof text}`); // 4, number ??
console.log(text.charAt(0)); // number 변했지만 text 가져올경우 타입에러 발생
// typescript 나오게됨
object
const duduri={name:'duduri' , age:20};
console.log(`value: ${duduri}`); //20
duduri.age=21;
console.log(`value: ${duduri}`); //21
참고자료
728x90
'Front-End > JavaScript & TypeScript' 카테고리의 다른 글
Web_components with Lit (0) | 2023.11.08 |
---|---|
JavaScript 와 ECMAScript 의 탄생 (0) | 2023.10.21 |
자바스크립트 메모리 관리 (1) | 2023.10.03 |
async vs defer (0) | 2022.05.30 |