hw.dev

Js 에서 객체를 생성하는 방법은 여러가지가 있다. 객체는 프로퍼티를 사용해서 객체의 상태를 표현하고, 객체의 메서드를 활용해서 프로퍼티를 참조하거나 프로퍼티 상태를 변경한다. 리터럴로 생성하는 방법은 간단하고 직관적이라는 장점이 있지만, 동일한 프로퍼티를 갖는 객체를 여러개 생성해야 하는 경우, 같은 코드를 반복적으로 써야 하므로 굉장히 비효율적이다. 이를 해결할 수 있는 생성자 함수로 객체를 생성하는 방법을 알아보자! 1. new 연산자 + Object 생성자 함수 const my_obj = new Object(); my_obj.Id = 'woong'; console.log(my_obj); // {Id : woong} 🧐 생성자 함수? new 연산자와 함께 호출하여 객체를 생성하는 함수를 뜻한다 꼭 ..

📌 var 키워드의 단점 1. 변수의 중복 선언 허용 var x = 10; console.log(x); var x = 20; console.log(x); 이미 선언되고 초기화까지 완료된 변수 x 의 중복선언을 허용한다. 전역변수가 의도치않게 값이 변경되면 에러를 발생시킬 가능성이 매우 높다. 2. 함수 레벨 스코프 var x = 1; if(true){ var x = 10; } console.log(x); 함수 레벨 스코프에서 선언한 변수가 아니면, 스코프를 생성하지 않고 전역변수로 취급한다. 이 문제 역시 의도치 않게 변수 값을 변경시킨다. 3. 호이스팅 console.log(x); var x = 1; 런타임 이전 자바스크립트 엔진에 의해서 선언문이 제일 선두로 끌어 올려지고 undefined 로 초기화..

3. 함수 호출 📌 매개변수와 인수 자바스크립트는 동적 타입 언어이기 때문에, 함수를 정의할때 사용하는 매개변수와 호출할 때 사용하는 인수의 타입과 갯수에 제한이 없다. 인수의 갯수가 매개변수의 갯수보다 많거나 적더라도 에러는 발생하지 않는다. function add(x, y){ return x + y; } console.log(add(2, 4)); // 6 // 인수가 부족한 경우 매개변수 y에 할당된 값이 없으므로 undefined console.log(add(2)); // NaN // 초과된 인수는 arguments 객체에 보존된다 console.log(add(2, 4, 10)); // 6 자바스크립트는 동적 타입 언어이기 때문에, 함수를 정의하는 시점에 매개변수의 타입을 결정할 수 없다. 따라서 ..

📌 Js 에서 함수 스코프, 실행 컨텍스트, 클로저, 생성자 함수에 의한 객체 생성, 메서드, this 바인팅, 프로토타입, 모듈화와 깊은 관련이 있기 때문에 js 함수는 정말 중요한 개념이다! 프로그래밍에서 함수를 사용하는 이유? var x = prompt(); var y = prompt(); if (Number(x) === Number(y)){ console.log(true) }else{ console.log(false) } function is_same(a, b){ return Number(a) === Number(b) } console.log(is_same(x, y)) 함수의 가장 큰 장점은 코드의 재사용이다. 함수 없이 두개를 비교해보는 경우를 생각해보면 if / else 를 반복적으로 써야하지..

원시 vs 객체 원시 : 원시 값을 변수에 할당하면 변수가 가르키게 되는 메모리의 주소에 실제 값이 저장된다. 이 변수를 다른 변수에 할당하면, 원시 값이 복사되어 전달된다 객체 : 객체를 변수에 할당하면 변수가 가르키게 되는 메모리의 주소에 참조 값(객체를 저장하고 있는 메모리의 첫번째 주소)이 저장된다. 이 변수를 다른 변수에 할당하면, 참조 값이 복사되어 전달된다 1. 원시 값 원시 값은 변경 불가능한 값이다. 즉, 한번 생성된 원시 값은 읽기 전용으로써 변경할 수가 없다. 🧐 '값을 변경할 수 없다.' 의 구체적인 의미가 무엇일까? var x = 10 x = 20 console.log(x) // 20 변수는 메모리 공간에서 주소를 식별하는 식별자이다. x는 10이 저장된 메모리의 주소를 기억하고,..

1. 객체란? JS 는 객체 기반의 프로그래밍 언어이며, JS 를 구성하는 거의 모든 것이 "객체" 이다! 원시타입(Number, String, Boolean ...)의 데이터를 제외한 나머지는 모두 객체로 취급된다고 생각하면 편하다 !! 원시 타입의 데이터들은 변경 불가능 한 값이다 !! var x = 10 x = 20 console.log(x) // 20 이것은, x의 값이 변경된 것 처럼 보이지만 실제로는 10이 저장된 메모리 주소에 접근해서 10을 20으로 변경하는 것이 아니라, 새로운 메모리 주소에 값 20을 넣고 x가 그것을 가르키도록 하는것이다. 값을 변경하는 것이 아니라 x가 가르키는 메모리 주소가 변경된다. 10이 저장된 메모리 주소는 이제 아무런 변수도 가르키고 있지 않기 때문에 자동..

Js에서 표현식의 평과 결과로 만들어지는 모든 값은 타입을 가진다. 앞에서는 어떤 타입이 있는지, 타입이 왜 필요한지에 대해서 알아봤다. 이번에는 타입의 변환에 대해서 알아보자~ 1. 타입 변환? 📌 명시적 타입 변환 var age = 24; var str = age.toString(); console.log(typeof str, str); // String 24 console.log(typeof x , x); // number 24 위의 코드와 같이 코드 작성자가 의도적으로 변수의 타입을 변환하는 것을 명시적 타입 변환 이라고 한다. 📌 암묵적 타입 변환 var x = 10; console.log(typeof x, x) // number 10 var str = x + '' // 10 + '' conso..

일반적으로 코드는 위에서 아래로 순차적으로 실행 된다. 제어문을 사용해서 코드 실행순서를 인위적으로 변경할 수 있다, JUMP 시키는 것! 1. 블록문 0개 이상의 문을 중괄호로 묶은 것 {} 코드 블럭으로도 불림 Js는 블록문을 하나의 실행 단위로 취급 => 함수가 있고 그 함수를 호출 한다면 호출된 함수가 하나의 실행 단위가 된다 제어문, 함수를 정의할때 일반적으로 사용한다! 변수를 선언할때도 블록문을 사용해서 할 수 있지만 굳이... 하지 않는다 { var age = 24; } if (age >= 20){ console.log("성인 입니다."); }else{ console.log("성인 아닙니다."); } function sum(a, b){ return a * b; } 2. 조건문 불리언 값으로 ..

표현식을 통해서 값을 생성하고 사용 되려면 우선 표현식 안에서 연산이 되야 한다. Js의 연산자에 대해서 알아보자~! 연산자 하나 이상의 표현식을 대상으로 산술 할당 비교 논리 타입 지수 연산을 수행하고 하나의 값을 생성한다 연산자 표현식도 표현식이다 1. 산술 연산자 수학적 계산을 수행하고 새로운 숫자 값을 만든다 산술 연산이 불가능한 경우에는 NaN 반환 피연산자의 수에 따라 이항과 단항으로 나뉨 1️⃣ 이항 산술 피연산자의 값을 변경하는 부수효과 X var num = 5 + 2; console.log(num) // 7 num 변수는 이제 7이라는 값이 저장된 메모리 주소를 기억하고 있지만 피연산자인 5와 2의 값은 그대로 2️⃣ 단항 산술 증가(++) 감소(--) 연산자는 피연산자의 값을 변경 va..

5. 표현식과 문 [DEEP DIVE] 5. 표현식과 문 Js나 다른 컴퓨터 공학 전반에서 자주 사용되는 용어의 의미에 대해서 주의 깊게 살펴보자! 1. 값 평가 ❔ 식을 해석해서 값을 생성하거나, 참조 하는 것 10 + 20; 위의 식은 평가되어 숫자 값 30을 hwdev.tistory.com 여기서, 모든 값은 데이터 타입을 가진다고 했었다 Js의 데이터 타입에 대해서 자세히 알아보자! 1. 숫자 타입 C, Java 는 정수, 실수, 차지하는 메모리 공간에 따라 int, float, double등 다양한 숫자 타입이 존재한다 Js는 하나의 숫자 타입만 존재한다 var inteager = 10; var double = 10.12; var negative = -20; 정수만 표현하기 위한 데이터 타입이 ..