Javascript
-
[Java Script] slice() 메서드 사용하기Java Script 2023. 3. 21. 17:49
자바스크립트에서 slice() 메서드는 기존 배열에 일부분을 추출하고 추출된 요소와 함께 새로운 배열을 반환해 주는 메서드입니다. | 사용 1. 문법 slice() 메서드는 매개변수로 2가지를 집어넣을 수 있습니다. array.slice(start, end) 여기서 start는 내가 추출하고 싶은 부분의 시작 인덱스이고 end는 종료 인덱스입니다. slice()는 start인덱스에서 end인덱스 전까지 부분이 추출되고, 만약 end 매개변수가 주어지지 않으면 시작 인덱스부터 배열 끝까지 요소가 추출됩니다. 2. 사용 let numbers = [1, 2, 3, 4, 5]; let numbers1 = numbers.slice(1, 3); console.log(numbers1); // [2, 3] 출력 이런 ..
-
[Java Script] Constructor function(생성자 함수) 알아보기Java Script 2023. 3. 16. 16:21
자바스크립트에서 생성자 함수를 사용하면 비슷하게 생긴 객체를 쉽게 만들어줄 수 있습니다. | 사용 1. 생성 생성자 함수는 일반 함수를 만드는 것 같이 만들면 되는데 this키워드를 사용하여 새로 생성할 객체의 값을 디자인하면 됩니다. function Person(name, age){ this.name = name; this.age = age; this.sayHi = function(){ console.log(`저의 이름은 ${name} 입니다`) } } 또한 생성자 함수의 이름의 첫 시작은 보통 대문자로 합니다. 2. 객체 만들기 작성한 생성자 함수로 객체를 만들려면 new키워드를 사용하면 됩니다. let 나 = new Person('Lee', '25'); let 너 = new Person('Kim',..
-
[Java Script] ?. 와 ?? 연산자 알아보기Java Script 2023. 3. 15. 14:16
| ?. (Optional Chaining) ?. 는 자바스크립트 object자료형에서 자료를 꺼내고 싶을 때 마침표를 찍어서 꺼내듯이 ?.도 비슷한 기능을 합니다. let data = { name: "Lee", age: 25 } console.log(data.name); // "Lee" 출력 console.log(data?.name); // "Lee" 출력 하지만 완전히 같은 기능을 하는 건 아니고, ?. 는 왼쪽에 있는 데이터가 null이거나 undefined인 경우 undefined를 남겨줍니다. 보통 중첩돼 있는 object자료에서 에러 없이 데이터를 꺼낼 때 사용합니다. 보통 데이터가 많이 중첩돼 있으면 중첩돼 있는 데이터를 잘못 꺼내는 경우가 생기는데 이럴 때 undefined를 남겨줘서 에러..
-
[Java Script] Spread Operator, Rest 파라미터 알아보기Java Script 2023. 3. 13. 16:47
| Spread Operator 자바스크립트에서 Spread Operator는 배열이나 객체의 요소를 또 다른 배열이나 객체로 분산하거나 복사할 수 있는 연산자입니다. 점 3개(...)를연달아 쓰면 이게 Spread Operator입니다. 활용 방법은 다음과 같습니다. 1. 배열 복사 spread operator를 사용해서 배열을 복사할 수 있습니다. let arr = [1, 2, 3, 4, 5]; let copy = [...arr] console.log(copy); // [1, 2, 3, 4, 5]; 2. 배열 합치기 spread operator를 사용해서 배열들을 합칠 수 있습니다. let arr1 = [1, 2, 3]; let arr2 = [4, 5]; let arr3 = [...arr1, ...a..
-
[Java Script] Array.from()알아보기Java Script 2023. 3. 7. 16:28
Array.from()은 자바스크립트에서 이터러블(iterable)한 객체나 문자열 같은 유사 배열 객체를 배열로 만들어주는 기능을 하는 메서드입니다. | 구조 매개변수로는 배열로 변환하고 싶은 유사 배열 객체와 배열의 모든 요소에 대해 적용하고 싶은 맵핑함수를 넣을 수 있습니다. let arr = Array.from(유사 배열 객체, 맵핑함수); | 예시 1. 원하는 배열 생성 let arr = Array.from({length: 5}, (v ,i)=> i ); // [0, 1, 2, 3, 4] 생성 let arr1 = Array.from({length: 5}, (v ,i)=> 0 ); // [0, 0, 0, 0, 0] 생성 console.log(arr); // [0, 1, 2, 3, 4] 출력 con..
-
[JavaScript] Map, Set 구조 알아보기Java Script 2023. 2. 25. 18:44
Map, Set은 자바스크립트에서 데이터를 저장하는 데 사용하는 구조입니다. | Map Map은 키와 값을 저장하는 객체입니다. 1. 생성 const map1 = new Map(); 이러면 map1을 변수로 하는 Map객체가 생성이 됩니다. 2. 사용 Map객체의 set() 메서드를 사용해 새로운 키-값을 추가하고, get() 메서드를 사용해 값을 검색할 수 있습니다. const map1 = new Map(); map1.set('key1', 'value1'); map1.set('key2', 'value2'); console.log(map1.get('key2')); // "value2" 출력 그리고 Map객체를 생성할 때 배열을 전달해 초기 키-값을 설정할 수도 있습니다. const map1 = new M..
-
[Java Script] map() 알아보기Java Script 2023. 2. 25. 17:26
map() 함수는 기존 배열의 각 요소에 함수를 적용하여 새로운 배열로 변환해 주는 함수입니다. | 구조 1. 구조 map() 함수의 구조는 다음과 같습니다. array.map((currentValue, index, array)=>{}); currentValue: 현재 처리 중인 요소의 값 index: 현재 처리 중인 요소의 값 array : 현재 배열 이런 식으로 콜백함수로 최대 3개의 인수를 가질 수 있고, 이중에 index와 array는 필수가 아니고 선택 요소입니다. 2. 예시 let arr = [1, 2, 3, 4]; let arr2 = arr.map((number)=> number * 2) console.log(arr2) // [2, 4, 6, 8] 출력 위 예제에서처럼 배열을 만들고 map(..