일렉치는 취준생

JavaScript에서 데이터 타입을 확인하는 대표적인 방법으로는 typeof가 있다. 이렇게 문자열 / 숫자 / Boolean / undefined / function은 typeof로 데이터 타입을 확인할 수 있다. // 데이터 타입 확인 console.log(typeof 'Hello') console.log(typeof 'Hello' === 'string') console.log(typeof 123 === 'number') console.log(typeof false === 'boolean') console.log(typeof undefined === 'undefined') console.log(typeof function(){}==='function') 하지만 null / 빈 배열 / 빈 객체의 경..

1. 형 변환 ( Type Conversion ) JavaScript에서 동등 연산자(==)를 사용할 때, 자동 형변환이 발생한다. // 형변환 const a = 1 const b = '1' // 일치 연산자 console.log(a === b) // 동등 연산자 ( 형변환이 일어난다 ) console.log(a == b) 변수 a의 값은 숫자고, b의 값은 문자열이지만 동등 연산자를 사용하였을 때, 형변환이 일어나 b가 숫자일때 a와 값이 동일해짐으로결과가 true로 나타난다. 이렇게 동등 연산자는 형변환이 일어날 수 있기 때문에, 일치 연산자를 사용하는 것이 안전하다. Boolnea 자동 형변환 JavaScript에서 true는 1로, false는 0으로 형변환이 발생한다. const a = true..

함수는 JavaScript에서 하나의 데이터고, 뒤에 소괄호를 열고 닫아야 함수가 동작한다. // function function hello() { console.log('Hello!') } // call hello() 함수에 소괄호를 쓰지 않으면? function getNumber() { return 123 } console.log(getNumber) console.log(getNumber()) 단순히 함수 그 자체가 출력되는 것을 확인할 수 있다. 함수 자체와 소괄호를 열고 닫아서 호출하는 것은 다르다. 소괄호를 열고 닫아 함수를 호출해야, 함수에 지정한 return 값이 나온다. 타입 확인 function getNumber() { return 123 } console.log(typeof getNum..

Object(객체)는 속성의 집합으로 속성과 값을 갖는다. 객체는 다양한 방법으로 생성할 수 있다. 1. 생성자 함수 방식 // object const user = new Object() user.name = 'KERORO' user.age = '63' console.log(user) 객체 데이터는 new 키워드와 함께 Object 함수로 생성 가능하다. 콘솔창으로 직접 확인해보면, 객체 데이터는 중간이 : (콜론) 으로 이루어진 key-value 형태임을 확인할 수 있다. key : 속성 / property value : 값 2. 함수 안에서 this를 이용해 만드는 방식 function User(){ this.name = 'KERORO' this.age = '98' } const user = new ..

원시 타입 : 객체가 아니면서 메서드도 가지지 않는 데이터 1. String : 문자열 const string1 = "hello" const string2 = 'hello' const string3 = `hello ${string1} ?!` console.log(string3) JavaScript 문자열은 큰 따옴표와 작은 따옴표 모두 사용가능하다. Template Literals : 기호를 통해 데이터를 만들어내는 방식 ` ` (백틱)을 사용할 경우 ${ }로 데이터 보관이 가능하다. JavaScript는 원시값(String)에도 메서드가 적용된다 let str = "test" let str2 = new String("test") console.log(str) console.log(str2) conso..

배열을 생성하는 2가지 방법 1. 생성자 함수 사용하기 2. [ ] 대괄호를 이용해 생성 const fruits = new Array('Apple','Banana','Cherry') console.log(fruits) const fruits2 = ['Apple','Banana','Cherry'] console.log(fruits2) new 키워드와 함께 생성자 함수를 호출하여 배열을 생성하는 방법과, 괄호를 이용하여 배열을 생성하는 방법 모두 동일한 결과가 나옴 괄호가 간단하고 좋으니 이 방법을 사용하자 JavaScript의 배열은 인덱싱이 가능하다 const fruits2 = ['Apple','Banana','Cherry'] console.log(fruits2) console.log(fruits2[1]..

기본 세팅 index.html Hello World! 1. Boolean const a = true const b = false if(a) { console.log('Hello') } if(b) { console.log('Hello') } JavaScript에서는 true일때만 함수가 동작한다 2. null - 명시적으로 존재가 없음을 나타냄 // null - 존재 X / 비어있다 / 알수없다 let age = null console.log(age) setTimeout(function () { // 1초뒤에 age 값이 85로 바뀜 age=85 console.log(age) }, 1000) null이 나타났다가 1초 후에 85로 값이 변경되어 나타남 null은 값이 null이라고 직접 명시해줘야한다 ! ..

JavaScript 변수 선언 방법엔 대표적으로 3가지가 있다. 1. let : block scope 지역 변수 선언 초기값 재할당이 가능하지만, 재선언은 불가능하다. 재선언은 빨간줄이 뜸 !! 선언과 동시에 원하는 값으로 초기화 할 수 있다. 2. const : block scope 읽기 전용 상수를 선언 const number = 10 number = 20 재할당하고 실행하면 에러가 발생함 재할당과 재선언이 모두 불가능하다. -> 한번 만들고 수정하지 않을 변수를 const로 선언하면 됨 선언 시 반드시 초기값을 설정해야 한다. 이후 값 변경이 불가능 3. var : 변수를 선언 재할당과 재선언이 모두 가능하지만, hoisting 되는 특성으로 인해 예기치 못한 문제가 발생할 수 있어 거의 사용하지 ..

JavaScript 시작하기 1. HTML 파일에 직접 JavaScript 코드 작성 -> HTML 파일을 만든 후 ! + tab 누르면 자동완성됨 Live Server 익스텐션을 사용하여 HTML 창을 바로 켜본다 HTML 창을 열고 개발자 도구에서 console을 확인하면, 입력한 JavaScript 코드가 보임 2. JavaScript 코드 분리하기 JavaScript 코드가 너무 길어지면, js 파일에 쪼개서 사용할 수 있다. 같은 위치에 start.js 파일 생성 ( 1 ) HTML 파일 script 부분 수정 js파일을 참조하도록 추가 ( 2 ) start.js 수정 console.log('hello, js') 동일하게 동작하는 모습 웹 브라우저의 console에 JavaScript 코드를 바..