📌Spread Operator(스프레드 연산자)란? ES6에서부터 등장한 Javascript의 Spread Operator에 대해서 알아보자. 처음 코드를 보았을 때는 누군가의 오타인 줄 알 만큼 문법의 형태가 특이했다. 이 스프레드 연산자를 사용하면 배열이나 문자열을 이용한 복잡한 연산을 단순하게 할 수 있고, 원본(배열, 객체)에 영향 없이 새로운 형태의 배열을 생성할 수 있다. 한번 알아보도록 하자. 📌기본 배열 const a = [1, 2, 3]; const b = [4, 5, 6]; const c = [7, 8, 9]; console.log(a); console.log(b); console.log(c); //result [1, 2, 3] [4, 5, 6] [7, 8, 9] 📌배열 복사(전개 연산..

Javascript의 배열의 합을 구하는 방법에는 무엇이 있을지 여러 가지 방법을 알아보고 실제 예제를 통해 익혀보도록 하겠습니다. 📌for문을 통한 반복 연산 var num = [1,2,3,4,5,6,7,8,9,10] var sum = 0; /* 반복을 통한 연산 */ for(var i=0; num.length; i++) { sum += num[i]; } console.log(sum); //55 📌forEach를 통한 연산 var num = [1,2,3,4,5,6,7,8,9,10] var sum = 0; /* forEach 반복 -> 기준 for문보다 더 간단하게 연산을 할 수 있음*/ num.forEach((item) => { sum += item' }); console.log(sum); //55 📌..

2023.03.22 - [Languages/Java] - [Java]JSON과 GSON의 관계는 무엇인가? [Java]JSON과 GSON의 관계는 무엇인가? 📌JSON(JavaScript Object Notation)이란? JavaScript Object Notation의 축약어인 Json은 개발을 하면서, 데이터를 저장하거나 전송하는 경우에 많이 사용되는 데이터의 형식이다. JSON 데이터 포맷은 사람과 기계 mooonstar.tistory.com 📌JSON 데이터의 키의 값을 추가 및 삭제하기 var jsonData = {NAME:"moonstar", BLOG: "tistory", GENDER: "MALE"}; //KEY -> 추가 jsonData.JOB = "developer"; console.lo..

최근 Javascript에 대한 관심이 커지면서 문법적인 부분을 먼저 공부하였다. 기본적인 문법을 익히고 나서는 Javascript의 동작 방식에 대해 궁금증이 생겼고, 가장 자주 쓰이며 꼭 알아야 할 지식인 동기(Synchronous)와 비동기(asynchronous)에 대해 공부를 하게 되었다. Javascript는 기본적인 싱글 스레드 언어! 이 글을 보는 사람 중에 저처럼 입문한 지 얼마 안 되신 분은 싱글 스레드란 말이 생소할 수도 있다. 쉽게 말하자 Javascript는 기본적으로 두 가지 일을 동시에 하지 못한다. 즉 한 개의 함수가 동작하고 있으면 다른 함수는 동작하지 않는다는 의미이다. 동기란(Synchronous)란? 앞서 말한 Javascript의 기본적인 동작 방식은 동기 형태로 동..

📌배열(Array)에서 중복 요소 찾기 Javascript에서 배열에 값을 추가할 경우 중복 여부에 대한 상관없이 값을 추가할 수 있다. 현재 필자가 개발하고 있는 소스에서 중복 여부에 대한 판단이 필요한 부분이 있었고, 필자가 사용한 방법에 대해 소개하려고 한다. 📌Javascript 배열 내장 메서드 filter() 의 활용 array.filter(function(element, index, array)) //array : 순회할 배열 //element : 현재 배열의 요소 //index : 현재 배열의 요소의 인덱스 📑Javascript 배열 내장 메서드 filter를 사용하여 조건에 맞는 요소만을 반환받을 수 있다. 📑기본 구조는 다음과 같다. 이와 같은 방식으로 조건을 추가하고 요소들을 순회하며..

재귀 함수(Recursion Function) "본디의 곳으로 다시 돌아오는 것"은 재귀의 사전적인 정의이다. 그렇다면 재귀함수(Recursion Function)은 무엇일까? 재귀함수는 정의 단계에서 자기 자신을 호출하는 함수를 말합니다. 재귀함수를 사용하면 반복문과 같이 동작시킬 수 있고, 반대로 모든 반복문도 재귀 함수로 구현이 가능하다. 재귀 함수(Recursion Function) 생성 //재귀함수 function recursionFunction() { ... //재참조 recursionFunction(); ... } 위와 같은 구조로 재귀함수 정의 단계에서 재귀 함수를 호출한다. 하지만 이렇게 함수 내부에서 자기 자신의 함수를 계속 참조한다면 함수는 끝나지 않을것이다. 그래서 특정 조건에 만족..

2022.12.01 - [Javascript] - [Javascript] 동기(Synchronous)와 비동기(asynchronous)란? [Javascript] 동기(Synchronous)와 비동기(asynchronous)란? 글을 쓰기전에.. 최근 Javascript에 대한 관심이 커지면서 문법적인 부분을 먼저 공부하였다. 기본적인 문법을 익히고 나서는 Javascript의 동작 방식에 대해 궁금증이 생겼고, 가장 자주 쓰이며 꼭 알 mooonstar.tistory.com 2022.12.04 - [Javascript] - [Javascript] 콜백(Callback) 함수란? [Javascript] 콜백(Callback) 함수란? ⚡️글을 읽기 전에. 콜백(Callback) 함수를 쉽게 이해하기 위해..

Fetch API 웹 개발을 하다 보면 클라이언트와 서버 간에 데이터를 주고받기 위해 HTTP 통신을 하게 됩니다. 오늘 포스팅은 Javascript의 비동기 통신을 위해 사용되는 Fetch API에 대해 알아보도록 하겠습니다. 동기, 비동기에 대해 잘 모르시는 분은 아래 링크를 우선 보고 와주시면 감사하겠습니다. 2022.12.01 - [Javascript] - [Javascript] 동기(Synchronous)와 비동기(asynchronous)란? [Javascript] 동기(Synchronous)와 비동기(asynchronous)란? 글을 쓰기전에.. 최근 Javascript에 대한 관심이 커지면서 문법적인 부분을 먼저 공부하였다. 기본적인 문법을 익히고 나서는 Javascript의 동작 방식에 대..

🔥var를 사용하지 않는 이유 ES6 이후 var를 사용함으로써 발생하는 문제를 해결하기 위해 새로운 변수 선언 방식인 let, const가 등장하였고, Javascript 코드에서 var의 선언 방식은 점차 사라지고 있다. 필자도 그러한 이유로 var 선언 방식을 거의 사용하지 않았다. var는 다음과 같은 문제를 갖는다. 💥변수명 중복 생성 가능 var name = "moonstar" console.log(name) //moonstar var name = "blog" console.log(name) //blog 위와 같은 같은 변수명에 서로 다른 값을 할당해도 문제없이 실행되는 모습을 볼 수 있다. 하지만 개발자의 실수로 같은 변수명을 선언하고 할당하는 경우, 기존의 변수에 할당되는 값이 변할 것이며..