javascript32 [Javascript] 연산자 Spread 사용 방법(2): Rest Parameter 지난 포스팅에서는 Spread 연산자에 대해서 알아보았습니다. Spread 연산자는 ... 키워드를 이용해서 배열을 손쉽게 복사하고 추가할 수 있는 키워드입니다. 이번 포스팅에서는 Spread 연산자를 이어서 Rest Parameter에 대해서 알아보도록 하겠습니다. Javascript Rest Parameter 일반적으로 Javascript의 함수 사용시 parameter로 값을 넣을 때에는 아래와 같이 사용합니다. let myFunc = function ( arg1, arg2, arg3 ) { ... } 받을 parameter의 개수를 파악하여 입력받을때 만들어줍니다. 그렇다면 Spread 연산자를 이용해 보면 어떨까요? let myFunc = function ( ...args ) { ... } 위와.. 2021. 5. 17. [Javascript] 연산자 Spread 사용 방법(1): 복사, 합치기 Javascript의 ES6버전을 소개해 드렸습니다. 그리고 하나씩 자세히 포스팅하고 있어요. 이번 포스팅은 Spread 연산자입니다. Javascript Spread 연산자 Javascript의 Spread 연산자는 ES6버전에서 새롭게 등장한 연산자입니다. 새롭게 등장했지만 너무나 활용도가 좋아서 Javascript를 이용하는 많은 프로그램(Node.js, React 등)에서도 자주 사용하는 문법입니다. Spread 연산자는 ... 입니다. 점 세 개를 연산자로 사용한다니 첫 느낌이 신기한 느낌입니다. Spread 연산자는 아래와 같이 사용합니다. const arr = [1, 2, 3, 4, 5]; console.log(...arr); // 1 2 3 4 5 Spread 연산자는 반복문처럼 배열에서 .. 2021. 5. 16. [Javascript] Arrow Function (ES6 버전) 지난 포스팅에서 Javascript의 ES6버전 이상에서 사용할 수 있는 키워드나 문법들을 알아보았습니다. 여러 가지가 있었지만 자세하게는 본 것이 아니기에 하나씩 다시 포스팅하려 합니다. 이번 포스팅에서는 Arrow Function에 대해서 알아보도록 하겠습니다. Javascript Arrow Function은 무엇인가 화살표 함수라고 표현하기도 모호하고 프로그래밍의 경우는 원어 그대로 사용하는 것이 더 직관적일 수 있기에 저는 Arrow function이라 사용합니다. Arrow function은 특별한 함수가 아닌 키워드를 의미합니다. 기존 함수의 생성은 아래와 같이 만들었습니다. function myFunc1() { console.log('myFunc1'); } let myFunc2 = funct.. 2021. 5. 14. [Javascript] Object 생성시 key를 변수에 담긴 문자로 사용하는 방법 Javascript를 이용해서 데이터를 주고 받을때에는 보통 Object를 사용합니다. 통신을 위해서는 JSON Object를 많이 사용하죠. 이때 변수에 담긴 문자 또는 문자열을 Object의 key로 사용하려 할때가 있습니다. 이번 포스팅에서는 Javascript Object 생성시 변수에 담은 문자열을 key로 사용하는 방법을 알아보겠습니다. Javascript Object 만들기 Javascript의 Object에 관련된 내용은 아래 포스팅에 자세하게 설명해두었습니다. 2021.05.01 - [쿤즈 Dev/HTML & CSS & Javascript] - [Javascript] Object의 생성과 사용 방법 [Javascript] Object의 생성과 사용 방법 앞선 여러 가지 포스팅에서 Java.. 2021. 5. 13. [Javascript] ES6(ECMAScript 2015)란 무엇인가 Javascript를 프로그래밍하다 보면 ES6 또는 ECMAScript2015라는 내용을 보신 적이 있을 겁니다. 혹은 알지 못해도 ES6 이상의 버전으로 프로그래밍을 하고 있을 수도 있습니다. 이번 포스팅에서는 ES6가 무엇인지 간략하게 알아보도록 하겠습니다. Javascript ES6 (EMCAScript 2015) 버전 Javascript는 ES6 (EMCAScript2015) 버전을 기점으로 사용방법이 조금 달라졌습니다. 물론 하위호환이 가능하여 기존에 사용하던 방법은 그대로 사용할 수 있으며 새롭게 사용하는 방법이 추가되었습니다. EMCAScript라는 것은 Javascript 프로그래밍 언어의 표준을 의미합니다. 모든 언어에는 표준이 존재하며 Javascript 역시 마찬가지입니다. 그렇다면.. 2021. 5. 11. [Javascript] 다중 배열(Multidimensional Arrays)에 대해서 알아보자 앞선 포스팅에서는 Javascript의 배열에 대해서 알아보았습니다. 배열은 여러 개의 Object를 하나의 변수에 담아서 사용할 수 있으며 배열에 담긴 모든 Object는 index로 접근이 가능합니다. 이번 포스팅에서는 배열속에 다시 배열을 넣은 다중 배열에 대해서 알아보겠습니다. Javascript 다중 배열이란 다중 배열은 배열에 다시 배열이 있는 배열을 말합니다. 배열 속에는 다양한 Object들이 포함될 수 있습니다. 배열 역시 하나의 Object이기 때문에 배열 내부에 다시 포함될 수 있습니다. 이러한 배열들을 2차 배열, 3차 배열이라 표현합니다. 구조는 동일하기때문에 2차 배열을 보도록 하겠습니다. const arrays = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]; .. 2021. 5. 10. [Javascript] 배열(Arrays)에 대해서 알아보자! 앞선 포스팅들에서 자바스크립트(Javascript)의 Object에 대해서 알아보았습니다. Object를 알았다면 또 하나 더 알아두어야 할 구조가 바로 배열(Arrays)입니다. 이번 포스팅에서는 배열이 무엇이고 어떻게 만들고 사용하는지 알아보도록 하겠습니다. Javascript 배열(Arrays)이란 먼저 배열은 여러 개의 Object들을 저장해놓은 공간이라 생각할 수 있습니다. 그래서 배열은 다음과 같은 형태를 가집니다. const arrays = [object, object, ... , object]; 배열 내부에는 숫자가 들어갈수도, 문자 혹은 문자열이 들어갈 수도 있습니다. 다양한 Object가 배열 내에 삽입될 수 있으며 이렇게 여러 개의 Object들이 배열을 구성합니다. 배열을 생성하는 .. 2021. 5. 8. [Javascript] 생성자 함수(Constructor Function) 사용하기 Javascript에서 사용하는 Object는 지난 포스팅에서 다뤄봤습니다. 내부에 변수를 저장하고 함수를 만들어서 사용할 수 있는 형태의 Object를 만들 수 있습니다. 그리고 또 이 Object를 함수 형태로 만들 수 있습니다. 이번 포스팅에서는 Constructor Function 이라 하는 생성자 함수에 대해서 알아보도록 하겠습니다. 생성자 함수(Constructor Function) 만들기 자바스크립트(Javascript)는 재사용 가능한 코드들을 한데 묶어서 사용할 수 있도록 Object를 만들 수 있습니다. 그중에서도 생성자 함수를 이용해서 아래와 같이 만들어 볼 수 있습니다. function Student() { this.name = 'Ironman', this.age = 43 } con.. 2021. 5. 7. [Javascript] Object와 메소드(Method)의 사용법 Javascript에서 Object를 만드는 것은 생각보다 직관적이고 쉽습니다. 그리고 이 Object 안에 메소드를 함께 넣어서 만들 수도 있습니다. 연관된 값들을 메소드를 이용해서 계산하고 결과를 출력해 줄 수도 있습니다. 이번 포스팅에서는 Object와 메소드를 함께 이용하는 방법을 알아보겠습니다. Object 내부 메소드 사용방법 Javascript Object를 생성시에 메소드를 만들 수 있습니다. const student = { num: 1, name: 'koonsland', hello: function(){ console.log('Welcome to Koonsland') } } 이렇게 만든 메소드는 점을 이용한 표현으로 아래와 같이 실행할 수 있습니다. student.hello(); 변수라면.. 2021. 5. 4. 이전 1 2 3 4 다음
