Language/JS(Node.js)22 [JavaScript] 자바스크립트에서 2차원 배열을 선언하는 방법 서론 대상독자 자바스크립트로 이차원 배열을 선언하고자 하는 개발자 오늘의 학습목표 자바스크립트에서 2차원 배열을 선언하는 방법을 알고, 이를 활용할 줄 안다. 본론 자바스크립트에서는 다른 언어와는 다르게, 이차원 배열이란 개념이 없습니다. 그러나 이차원 배열 자체를 활용할 수 없는 것은 아닙니다. 오늘은 자바스크립트에서 중첩 배열을 통해, 2차원 배열과 같은 형태를 선언하는 방법에 대해서 알아보도록 하겠습니다. 이차원 배열을 생성하는 방법 자바스크립트에서는 const arr = [][] 혹은 const arr[3][3]와 같은 방법으로 선언해서 사용할 수 없습니다. 따라서 아래와 같은 방법을 따라야 하는데요. 배열에 초깃값을 할당하는 방법 가장 첫번째 방법은 아래와 같이 배열 안에 배열을 넣어 초기화해주.. Language/JS(Node.js) 2021. 12. 25. [JavaScript 내장함수 다루기 ⑤] Array.Prototype.pop/push/unshift/shift Array.Prototype.pop 배열의 마지막 인덱스에 있는 값을 제거하고 해당 값을 반환합니다. const arr = [1,2,3]; arr.pop(); // 3 Array.Prototype.push 배열의 마지막 인덱스에 값을 추가하고 배열의 새로운 길이를 반환합니다. arr.push(4); // 3 console.log(arr); // [1, 2, 4] Array.Prototype.unshift 배열의 첫번째 인덱스에 값을 추가하고 배열의 새로운 길이를 반환합니다. arr.unshirt(10); // 4 console.log(arr) // [10, 1, 2, 4] Array.Prototype.shift 배열의 첫번째 인덱스에 있는 값을 제거하고, 제거된 값을 반환합니다. arr.unshift().. Language/JS(Node.js) 2021. 12. 23. 프론트엔드 면접 질문 정리 ⑤ TypeScript 질문 서론 오늘은 프론트엔드 개발에 화두 중 하나인 타입스크립트에 관한 인터뷰 질문들을 정리해보았습니다. 해당 글을 번역한 글이므로, 원문을 확인하고자 하시는 분들은 직접 방문하셔서 확인해보시길 추천드립니다. 본론 타입스크립트의 특징은 무엇인가요? 기준 TypeScript JavaScript 패러다임 객체 지향 언어 스크립트 언어 Typing Method 정적 타이핑 동적 타이핑 Module System 지원 미지원 Optional Parameters 지원 미지원 언어의 패러다임 : 물론 Tsc도 자바스크립트에 속한다. 그러나 Tsc는 클래스와 인터페이스 그리고 정적 타이핑을 제공하는 자바나 C#과 같은 객체 지향 프로그래밍 언어이기도 하다. 타이핑 방법 : 자바스크립트는 기본적으로 변수에 값이 할당될 때, .. Language/JS(Node.js) 2021. 5. 27. [JavaScript 내장함수 다루기 ③] Array.Prototype.map, 배열의 원소를 1:1 매핑해보자. Array.Prototype.map arr.map(callback(currentValue, index, array), thisArg) 오늘 JavaScript 내장함수 다루기에서 다뤄볼 함수는 map 함수입니다. map 함수에 대해 알아보기에 앞서, 간단하게 map 함수를 사용해보겠습니다. map 함수 안에 콜백함수를 등록합니다. 콜백함수의 파라미터로 아무런 변수로 지정한 뒤, 이를 계산에 활용하여 return 합니다. const a = [1, 2, 3]; const doubled = a.map((num) => { return num * 2; }); console.log(a === doubled) // false // a = [1, 2, 3]; // doubled = [2, 4, 6]; map 함수가 동.. Language/JS(Node.js) 2021. 5. 17. 프론트엔드 면접 질문 정리 ② JavaScript 질문 이벤트 위임이란? 이벤트 위임은 event bubbling을 활용해 이벤트 리스너를 하위 요소에 추가하는 대신 상위 요소에 추가하여, 이벤트 핸들러를 줄임으로써 메모리 사용을 줄이는 방법을 말한다. 이벤트 전파의 의미와 그 종류? 이벤트 전파란 여러 이벤트가 발생하는 순서를 정하는 방식을 말한다. 이는 HTML 태그가 중첩되어 있기 때문이며, 여러 태그에 각각 이벤트가 설정되어 있을 때(이게 중요하다! 만약 자식 태그에만 이벤트가 등록됐을 경우, 부모 태그는 무시하고 자식 태그의 이벤트만 발생될 것이기 때문임) 어떤 것부터 실행할지를 결정하는 것을 말한다. 종류는 이벤트 캡처링과 이벤트 버블링 2가지가 있다. 이벤트 버블링이란 하위 태그에서부터 상위 태그로 올라가는 것을 말한다. 기본적으로 설정된다. 이.. Language/JS(Node.js) 2021. 5. 14. [JavaScript 내장함수 다루기 ②] Array.Prototype.Filter, 조건에 부합하는 값만 반환한다. Array.Prototype.Filter(callback) Filter 함수는 자바스크립트를 쓸 때 자주 쓰이는 함수 중 하나로, 배열 원소들 중 일부 값을 추출해내기 위하여 사용한다. 사용방법은 filter의 매개변수로 callback 함수를 두되, 해당 함수는 return 값으로 true 혹은 false 값을 갖는 함수여야 한다. const objArr = [ { id: 1, data: "리액트 초급 배우기", checked: true, }, { id: 2, data: "리액트 중급 배우기", checked: true, }, { id: 3, data: "리액트 고급 배우기", checked: false, }, ] const filterdObjArr = objArr.filter((obj) => obj... Language/JS(Node.js) 2021. 5. 12. [JavaScript 객체 파헤치기 ①] Object.key(obj), 객체의 필드 값을 배열로 반환해준다 자바스크립트의 객체 다루기 그걸 알고 있었는가? 자바스크립트의 대부분의 요소들은(배열, 함수 등) 사실 객체다. 자바스크립트의 데이터 형식에는 Primitive Types(원시타입)와 Non Primitive Types(비원시타입)로 나뉜다. 전자는 string, number, null, boolean, undefined, symbol 총 6개가 속하고 후자는 functions, arrays and objects가 속하는데, 이들 역시 전부 객체로 간주된다. 이와 관련하여선 추후에 포스팅으로 설명하겠다. 만약 관심이 있는 사람은 해당 글을 참고하면 좋을 것이다. 객체란? '객체란 무엇인가'에 대해서는 이미 블로그에서 다룬 바 있다. 내용을 요약하면 객체란 각각 키(key)와 값(value).. Language/JS(Node.js) 2021. 5. 12. [JavaScript 내장함수 다루기 ①] Array.Prototype.Sort, 자바스크립트로 정렬하기 Array.Prototype.sort(sortFunc) JavaScript로 코딩테스트 문제를 풀다보면, sort 함수를 사용해서 값들을 정리하는 경우가 많다. 배열의 내장함수인 sort 함수에 대해서 알아보자. 문자열 정렬은 ASCII 문자 순서대로 // 문자열 정렬 const months = ['March', 'Jan', 'Feb', 'Dec']; months.sort(); console.log(months); // expected output: Array ["Dec", "Feb", "Jan", "March"] // 숫자 정렬 const array1 = [1, 30, 4, 21, 100000]; array1.sort(); console.log(.. Language/JS(Node.js) 2021. 5. 6. [JavaScript] Scroll Event에 자주 쓰이는 변수/메소드 정리 .offsetTop( ) : 해당 HTML 요소의 Y좌표 위치 반환 .scrollY : 현재 스크롤의 Y좌표 위치 반환 .scrollTo( X좌표, Y좌표 ) : 파라미터로 받아온 X, Y 좌표로 스크롤을 이동시킴 Language/JS(Node.js) 2020. 11. 13. [JavaScript] 객체란 무엇인가? 객체란 무엇인가? 자바스크립트에서 객체는 여러모로 쓸모가 많다. JSON 파일에서 전송되는 데이터도 객체이고, DOM 조작에 활용되는 document와 BOM 조작과 관련된 전역객체인 Windows 역시 객체이다. 또한 객체지향 프로그래밍으로 소프트웨어를 설계할 때에도 활용되는 것이 객체이다. 객체의 의의 객체란 현실의 사물을 프로그래밍적으로 표현하기 위하여, 활용되는 수단이다. 예를 들어, 나(이준호)라는 사람을 객체로 표현한다면 다음과 같이 표현할 수 있을 것이다. juno라는 객체를 만들고 그 안에 각각 firstname(변수), lastname(변수), body(객체), hobby(배열), eat(함수), boxing(함수), cooking(함수)를 넣었다. 즉, 나라는 객체 안에 사람이 할 수 .. Language/JS(Node.js) 2020. 11. 12. 이전 1 2 다음 반응형