본문 바로가기
Develope_Web_Programming/01_HTML&CSS&JS

3. 데이터 타입, data types, let vs var, hoisting

by 스타트업_디벨로퍼 2021. 2. 13.
💡
입력 연산 출력이 주요 기능이다!! → 전송도 포함일 수 있다! CPU에 최적화된 연산, 메모리에 최적화된 연산이 중요하다!!
// 1. Use strict

// added in ES 5
// use this fro Vanila JavaScript

'use strict';

// 2. Variable
// let (added in ES6)

let name = 'ellie';
console.log(name);
name = 'hello';
console.log(name);

//2-1. Block

{
        
    let name = 'ellie';
    console.log(name);
    name = 'hello';
    console.log(name);

}

//지역 변수로 쓰게 되면 출력이 되지 않는 문제점이 있다!! 
console.log(age); //이래도 에러가 없음!!! 
age = 4;
console.log(age);
var age; //var hoisting! (끌어올려주다. 선언되지도 않았는데 선언된것처럼 끌어올려주는 것!  )

//call = 4;
//let call; //에러 (이게 정상) 

//블럭 안에 넣어놔도 var는 지역 변수처럼 적용이 안됨.

// 3. Constant -> 선언과 동시에 할당됨!! 
/**
 * Favor immutable data type always for a few reasons:
 * security
 * thread safety
 * reduce human mistakes
 */

const daysInWeek = 7;
const maxNumber = 5;

//4. Variable Types

// primitive, single item : number , string, boolean, null. undefined, symbol
// object, box container
// function, first-class function (인자로 전달 가능!! )
// JavaScript에서는 number만 정하게 됨!! 

let a = 12;

// let a : number = 12; //TypeScript 

const count = 17; //integer
const size = 17.1; //decimal number

console.log(`value: ${count}, type  : ${typeof count}`);
console.log(`value: ${size}, type  : ${typeof size}`);

//number  - special numeric values:

const infinity = 1/0;
const negativeInfinity = -1/0;

const nAn = 'not a number' / 2;
console.log(infinity); //Infinity
console.log(negativeInfinity); //-Infinity
console.log(nAn); //NaN

//bigInt (farily new , don't use it yet)

const bigInt = 1234567890123456789012345678901234567890; //over(-2**53)
console.log(`value : ${bigInt}, type : ${typeof bigInt}`); //뒤에 n 추가하면 bigint로 인식됨!! 
Number.MAX_SAFE_INTEGER;


//string
const char = 'c';
const bredan = 'brendan';
const greeting = 'hello' + bredan;
console.log(`value : ${greeting}, type:${typeof greeting}`);
const helloBob = `hi ${bredan}!`; //template literal (string)
console.log(`valueL${helloBob}, type: ${typeof helloBob}`);

//boolena 
//false: 0, null , undefine, NaN, ''
//true: any other value

const canRead = true;
const test = 3<1; //false

console.log (`value: ${canRead}, type: ${typeof canRead}`);
console.log (`value: ${test}, type: ${typeof test}`);

//null
let nothing = null;
console.log(`value: ${nothing}, type: ${typeof nothing}`);


//undefined
let x;
console.log(`value: ${x}, type: ${typeof x}`);

//symbol, create unique identifiers for objects

const symbol1 = Symbol('id');
const symbol2 = Symbole('id');
console.log(symbol1=== symbol2); //다르다는 것을 알 수 있다! 


const gsymbol1 = Symbol.for('id');
const gsymbol2 = Symbole.for('id');
console.log(gsymbol1=== gsymbol2); //True
console.log(`value: ${symbol1.description}, type : ${typeof symbole1}`); 

//object, real-life object, data structure

const ellie = {name : 'ellie', age :20}; //object형성 가능
ellie.age = 21;

// 5. Dynamic typing : dynamically typed language

let text = 'hello';
console.log(text.charAt(0)); //h
console.log(`value: ${text}, type : ${typeof text}`); 
text = 1;
console.log(`value: ${text}, type : ${typeof text}`); //number
text = '7' + 5; 
console.log(`value: ${text}, type : ${typeof text}`); //string
text = '8' / '2'; 
console.log(`value: ${text}, type : ${typeof text}`); //number


console.log(text.charAt(0)); //여기서는 동작 안함!! 이것이 dynamic programming의 문제!!
 

Notion2Tistory

 

boltlessengineer.github.io

출처 : 드림코딩 by 엘리 youtu.be/OCCpGh4ujb8

반응형