본문 바로가기

728x90

Web

[JavaScript] 객체지향문법 - Primitive / Reference data type 객체지향 문법을 알아보기 위해 반드시 알고 있어야 하는 Reference data type, Primitive data type에 대해 알아보겠습니다. 자바스크립트의 자료형(문자, 숫자, 배열, object 등)은 크게 2개로 분류할 수 있습니다. Primitive와 Reference로 분류됩니다. Primitive data type 자료 자체가 변수에 바로 저장되는 자료들입니다. 문자, 숫자 자료형들이 대표적입니다. // primitive data type var data1 = 'hello'; var data2 = 1234567890; Reference data type 배열, Object 자료형은 Reference data type에 속합니다. 자료를 변수에 직접 저장하지 않고 자료의 값이 저장된 주.. 더보기
[JavaScript] 함수에서 쓰는 점 3개, Rest Parameter ES6부터 arguments보다 더 쉬운 문법인 Rest Parameter를 제공합니다. arguments를 사용한 함수에서 새로운 파라미터를 추가할 때 함수를 수정해야 하는 불편함이 있습니다. 하지만 Rest Parameter를 사용하면 새로운 파라미터를 추가할 때 쉽게 새로운 파라미터를 추가하거나 제거할 수 있습니다. arguments는 모든 파라미터를 [ ] 에 담아서 보여주지만 실제 배열은 아닙니다. 유사배열입니다. 실제 배열로 사용하기 위해서는 변환작업이 필요합니다. Rest Parameter는 함수를 만들 때 '...' 이라는 점 세개를 사용한 스프레드(Spread)연산자를 사용할 수 있습니다. 특정 부분 이상 입력된 파라미터들을 묶어서 [ ]에 담아 보여주며 실제 배열로 나타내줍니다. 따로 .. 더보기
[JavaScript] apply, call 함수 알아보기 apply / call 해당 함수를 실행할 때 다른 오브젝트에 함께 적용해서 실행해달라는 뜻입니다. 해당 값들이 합쳐지는 것은 아닙니다. 실행 할 때만 합쳐서 실행되는 것입니다. call 또한 apply와 똑같은 기능을 지원합니다. // person2에 person의 hello라는 키와 값을 넣어주면서 실행하고 싶을 때 var person = { hello : function(){ console.log('안녕') } } var person2 = { name: '홍길동' } person.hello.apply(person2); // -> person.hello를 person2에 합쳐서 실행한다 person.hello.call(person2); // -> person.hello를 person2에 합쳐서 실행한다 더보기
[JavaScript] 스프레드 오퍼레이터(Spread Operator) Spread Operator 마침표를 연달아 3개 ( ... ) 를 찍는 문법을 스프레드 오퍼레이터(Sprade Operator)라고 합니다. 한글로는 '펼침연산자'라고도 합니다. 스프레드 오퍼레이터는 대괄호, 중괄호, 소괄호 안에서만 사용 가능하며 외부에서 사용할 경우, 에러가 발생합니다. 1. 스프레드 오퍼레이터는 배열(Array)에 사용하면 대괄호를 제거하여 나타내줍니다. var array = ['hello', 'world']; console.log(array); // -> ['hello', 'world'] console.log(...array); // -> 스프레드 오퍼레이터가 대괄호를 제거해주어 'hello', 'world'로 변환되어 // 최종적으로 hello world가 출력된다. 2. 스프.. 더보기
[JavaScript] 문자 다루는 방법(Template Literals) 기존의 자바스크립트에서 문자를 작성할 때 불편한 점을 해결하기 위해 나온 문법입니다. 따옴표 대신 백틱(Backtick) 혹은 백쿼트(Backquote)라고 불리며 ( ` ` ) 기호를 사용하여 문자를 만들 수 있습니다. 위치는 키보드의 1옆의 ` 기호 입니다. 이 문법을 사용할때의 장점은 무엇인지 알아봅시다. 1. 엔터키를 사용하여 작성 가능합니다. - 기존 따옴표( ' ', " " )를 쓸 때 엔터키를 사용하면 문자열이 깨지게 됩니다. - 백틱을 사용하면 엔터키를 사용하여도 문자열이 깨지지 않습니다. var text = '안녕 하세요'; // 기존의 따옴표로는 엔터로 줄을 나누면 문자열이 깨져 에러가 발생한다. var text = `안녕 하세요`; // 백틱을 사용하면 엔터로 줄을 나누더라도 에러가 .. 더보기
[JavaScript] 전역변수, 지역변수 전역변수 전연변수란, 모든 곳에서 쓸 수 있는 변수를 말한다. 함수 바깥에서 선언한 변수는 함수 안에서 사용이 가능한 전역변수가 된다. var age = 20; // 함수 밖에서 선언한 변수는 전역변수가 된다. function fc(){ console.log(age); } fc(); // 값 -> 20 또한, window를 사용하여 전역변수를 만들 수 있다. var age = 20; // 기본 사용 방법 window.name = 'kim'; // window를 사용한 전역변수 만드는 방법 console.log(name); // 'kim' console.log(window.name); // 'kim' 지역변수 함수 안에서 만들어진 변수는 함수 안에서만 사용할 수 있으며, 지역변수라고 부른다. var age.. 더보기
[JavaScript] 호이스팅(Hoisting) 호이스팅(Hoisting) 호이스팅(Hoisting)이란, 자바스크립트의 변수나 함수의 선언부분을 변수의 맨 위 범위로 강제로 끌고가 가장 먼저 선언합니다. 이 현상을 호이스팅(Hoisting)이라고 합니다. // 우리가 작성한 코드 function fc(){ var name = 'kim'; } if(true){ let name = 'park'; } var age = 30; // 이 부분에서 호이스팅이 일어남 ------------------------------ // 호이스팅이 되었을 때의 상황 var age; // -> 우리가 작성한 코드에는 아래 선언했지만 Hoisting 현상으로 맨 위로 끌어올려 선언시키게 됨 function fc(){ var name = 'kim'; } if(true){ let.. 더보기
[JavaScript] 변수 신문법 : var, let, const 기본 변수 사용법 var 변수이름 = 저장할 값 기존에 사용하던var, 그리고 ES6부터 새로 생긴 let, const 변수에는 선언, 할당, 범위 라는 특징이 있다. var : 재선언 가능, 재할당 가능, 범위 function let : 재선언 불가능, 재할당 가능, 범위 중괄호 { } const : 재선언 불가능, 재할당 불가능, 범위 중괄호 { } 재선언이란? - 같은 변수 이름을 여러번 선언을 할 수 있다. - let, const는 재선언이 불가능하다. // var는 재선언이 가능하다. var name = 'kim'; var name = 'park'; var name = '~~~~~'; // -> 가능 // let, const는 재선언이 불가능하다. let age = 20; let age = 30.. 더보기

728x90