티스토리

Ron's learning record

검색하기

블로그 홈

Ron's learning record

rondeveloper.tistory.com/m

rondeveloper 님의 블로그입니다.

구독자: 1

방명록 방문하기

주요 글 목록

map 함수를 사용 후 중괄호([])로 접근할 때 map 을 사용해 여러 개의 값을 입력받아 바로 리스트에 저장하는 코드를 작성했다. 코드는 다음과 같았다. fish_price = map(int, input("가격: 2000 2500 3000").split()) 하지만 이것을 사용해서 fish_price의 원소에 [] 인덱스로 접근했을 때 fish_price = map(int, input("가격: 2000 2500 3000").split()) print(fish_price[1]) 위 코드를 실행하면 아래와 같은 에러가 발생한다. fish_price의 타입을 체크해보면 다음과 같다. fish_price의 타입은 바로 map 이다. map은 iterable을 반환합니다. 간단히 말하면 한 번에 하나씩 원소를 차례대로 내뱉은 존재이기 때문에 중괄호([])와 .. 공감수 0 댓글수 0 2024. 1. 4.
얕은 복사와 깊은 복사 얕은 복사와 깊은 복사는 프로그래밍에서 객체를 복사하는 두 가지 방법입니다. 얕은 복사(shallow copy) 얕은 복사란 원본 객체의 주소를 복사하여 새로운 객체를 생성하는 방식입니다. 원본 객체와 복사된 객체가 같은 메모리를 참조하므로 한쪽의 객체를 변경하면 다른 쪽의 객체도 함께 변경됩니다. old_list = [[1, 2, 3], [4, 5, 6], [7, 8, 'a']] new_list = old_list.copy() new_list[2][2] = 9 print(f"{old_list=}, {new_list=}") print(f"{id(old_list)=}, {id(new_list)=}") print(f"{id(old_list[0])=}, {id(new_list[0])=}") old_list를 .. 공감수 0 댓글수 1 2024. 1. 4.
값 비교 시 is 연산자를 쓰면 안되는 이유 is 연산자는 두 값이 같은지를 비교하는 것이 아닙니다. 두 객체가 메모리 상 동일한 주소에 저장되어 있는지를 비교합니다. 그렇기 때문에 두 값을 비교할 때는 반드시 is 연산자가 아닌 == 연산자를 사용해야 합니다. is 연산자는 어떻게 동작하는지 직접 코드를 작성하며 알아봤습니다. a = 1000 b = 1000 # 값이 같은지 비교 print(a == b) # 메모리 상에 각각 변수 a, b 에 저장된 값이 저장된 위치 print(id(a), id(b)) # 메모리 상 동일한 주소에 저장되어 있는지 비교 print(a is b) # 출력 결과 True 134878452576752 134878452577488 False 참고) 파이썬에서 정수 256 까지는 이미 해당 값이 메모리 상에 존재하면 기존의.. 공감수 0 댓글수 0 2023. 12. 29.
[JavaScript] 커링 커링이란? 커링이란 f(a, b, c) 를 f(a)(b)(c) 와 같이 여러 개의 인수를 단일 프로세스로, 호출 가능한 함수를 다중 프로세스 형태로 변환할 수 있도록 하는 기술이다. 보통 자바스크립트에서 커링되어진 함수는 평소처럼 호출도 하고 만약에 인수들이 충분하지 않을 때는 partial 을 반환한다. 커링은 partial 을 쉽게 적용할 수 있도록 해준다. 커링을 사용하는 이유? 커링 함수를 사용하는 이유는 함수가 여러 개의 인자를 받을 때 특정 인자를 고정할 수 있습니다. 그로 인해 함수의 재사용성을 높일 수 있습니다. // 커링을 사용한 함수 const currying = a => b => c => a * b * c; console.log(currying(1)(2)(3)); // 6 // 인수 .. 공감수 0 댓글수 0 2023. 1. 12.
[JavaScript] iterable 객체 들어가며 JavaScript 에서 Array 가 제공하는 map, filter, reduce 등의 메서드를 직접 구현하는 과정에서 for ... of 문을 공통적으로 사용했다. for ... of 문으로 순회 가능하기 위해서는 반드시 해당 자료구조가 iterable 해야 한다는 것을 알게 되었다. 하지만 iterable 이 무엇이고 어떤 역할을 하는지 알지 못해 이번 시간을 통해 이에 대해 알아보고자 한다. ko.javascript.info 사이트에서 이에 대해 잘 설명해주고 있어 이 자료를 참고했다. iterable 객체란? iterable 객체란 반복 가능한 객체라고 부르기도 하며, for ... of 구문과 함께 ES2015에서 도입되었다. iterable 객체와 다른 객체와의 가장 큰 차이점은 객.. 공감수 0 댓글수 0 2023. 1. 11.
[JavaScript] 예시를 통해 알아보는 this JavaScript에서 this 는 함수 호출 방법에 의해 결정된다. 예시1) 객체 메소드의 this const phone = { name: 'Galaxy Note 3', getName: function () { console.log("getName: ", this); }, } phone.getName(); // output: getName: {name: 'Galaxy Note 3', getName: f} getName 메소드의 호출자가 phone 객체이므로, getName 실행 시 this 는 phone 객체이다. 예시2) 전역 객체에서의 this const phone = { name: 'Galaxy Note 3', getName: function () { console.log("getName: ", .. 공감수 0 댓글수 0 2022. 12. 28.
[TypeScript] Conditional Types, extends, infer Conditional Types TypeScript에서 삼항 연산자를 이용해 타입을 지정하는 방식입니다. 예시) TypeScript에 내장된 Utility Types의 Extract 타입 type Extract = T extends U ? T : never T extends U 가 참이면 T를, 그렇지 않으면 never를 반환합니다. 삼항 연산자의 조건문에 올 수 있는 문법에는 extends 키워드 밖에 없습니다. extends extends 키워드는 슈퍼 클래스를 서브 클래스에게 상속해 줄 때 사용하는 키워드입니다. 타입 지정 시, extends 키워드는 T extends U 에 대해 T 는 U 에 포함된다는 의미입니다. extends 키워드가 사용되는 조건문 예시를 살펴보며 제대로 이해한 게 맞는지 .. 공감수 0 댓글수 0 2022. 12. 25.
[TypeScript] 기본 타입 TypeScript 의 기본 타입에는 boolean, number, string, array, tuple, enum, any, void, null, undefined, never, object 등이 있습니다. 이에 대해 하나씩 예시와 함께 살펴보겠습니다. 불린(Boolean) true 혹은 false 값을 나타냅니다. let isExist:boolean = false; 숫자(Number) TypeScript의 모든 숫자는 부동 소수 값입니다. 16진수, 10진수 리터럴에 더불어 2진수, 8진수 리터럴도 지원합니다. // 10진수 리터럴 let decimal: number = 3; // 16진수 리터럴 let hex: number = 0xf00d; // 2진수 리터럴 let binary: number = .. 공감수 0 댓글수 0 2022. 12. 20.
[JavaScript] 문자열 자르기 (substr, substring, slice) 들어가며 이번 게시글에서는 자바스크립트에서 문자열을 자르는 함수에 대해 알아보고자 합니다. 자바스크립트에서 문자열을 자르는 함수 자바스크립트에서 문자열을 자르기 위해서는 substr(), substring(), slice() 함수를 사용하면 됩니다. String.prototype.substr(start[, length]) String.prototype.substring(indexStart[, indexEnd]) String.prototype.slice(beginIndex[, endIndex]) 위 세 가지 함수의 인수 중 대괄호([]) 부분은 생략 가능하며, 생략할 경우 시작 위치부터 문자열 끝까지 자릅니다. substr() 함수 substr() 함수는 시작 위치부터 해당 길이만큼 문자열을 자르는 기본적.. 공감수 0 댓글수 0 2022. 12. 5.
[OOP] 다형성 다형성이란? 다형성이란 하나의 타입에 여러 객체를 대입할 수 있는 성질을 말합니다. 다형성의 장점 다형성을 활용하면 기능을 확장하거나, 객체를 변경해야 할 때 타입 변경 없이 객체 주입만으로 수정이 일어나게 할 수 있습니다. 또한 상속을 사용한다면 중복되는 코드까지 제거할 수 있으므로 더 객체 지향 설계에 가까워질 수 있습니다. 다형성을 왜 사용하는가? Polymorphism allows us to perform a single action in different ways. (ref. https://www.w3schools.com/java/java_polymorphism.asp) 다형성은 하나의 행동을 여러 방식으로 수행할 수 있게 해줍니다. 다형성을 구현하는 방법 다형성을 구현하는 방법에는 대표적으로 .. 공감수 0 댓글수 0 2022. 11. 19.
TypeScript 언어 소개 및 장점 및 단점, 컴파일러 동작 방식 이 포스트에서 다룰 내용 TypeScript 란? TypeScript 장점 및 단점 TypeScript 컴파일러 동작 방식 TypeScript 란? TypeScript 란 순수 JavaScript 로 컴파일하는 정적 형식의 JavaScript 슈퍼셋입니다. 쉽게 말해서 JavaScript 에 타입을 부여한 정적 타입 언어입니다. TypeScript 의 장점 1. 컴파일러를 통해 사전 에러를 발견할 수 있습니다. 만약 타입스크립트를 설치하면 tsc 라는 명령어로 타입스크립트 파일을 컴파일할 수 있습니다. 이때 컴파일 단계에서 문법 에러를 잡을 수 있으므로 사소한 실수들을 프로그램 실행 전 모두 체크할 수 있습니다. 2. 타입을 강제화합니다. 타입스크립트는 모든 객체에 타입을 강제화하여 타입으로 발생하는 문.. 공감수 0 댓글수 0 2022. 11. 14.
JavaScript 의 동작방식 살펴볼 내용 - 코드를 통해 알아보는 JavaScript 동작 방식 - JavaScript 런타임 환경 구성 JavaScript의 동작 방식(싱글 스레드, 콜스택) JavaScript 는 싱글 스레드 즉 단 하나의 스레드를 기반으로 한 프로그래밍 언어입니다. 싱글 스레드라는 말은 하나의 메인 스레드와 하나의 콜스택(호출 스택)을 가진다는 것입니다. 하나의 메인 스레드에서 호출되는 함수들은 하나의 콜스택에 쌓입니다. 이 함수들은 스택 구조 특성상 LIFO(Last In First Out) 방식으로 실행됩니다. 예시를 통해 알아보기 function a() { function b() { function c() { console.log("c"); } c(); console.log("b"); } b(); cons.. 공감수 0 댓글수 0 2022. 11. 12.
[JavaScript] 반복문 반복문이란? 일반명사) 되풀이하는 것 고유명사) 프로그램 소스 코드 내에서 조건을 만족할 때까지 특정한 부분의 코드가 반복적으로 수행될 수 있도록 하는 구문 반복문의 종류 for 문 for 문은 조건식이 거짓으로 판별될 때까지 코드 블록을 반복 실행한다. 문법 : for (초기화식; 조건식; 증감식) { // ... 조건식이 참인 경우 반복 실행될 코드 ... } 예시) for (let i = 0; i < 3; i++) { // 0, 1, 2 가 출력된다. console.log(i); } 초기화식 let i = 0 반복문에 진입할 때 단 한 번 실행됨. 조건식 i < 3 반복마다 해당 조건이 확인됨. false 이면 반복문을 멈춤. 본문 console.log(i) 조건이 true 일 동안 계속해서 실행된.. 공감수 0 댓글수 0 2022. 11. 5.
[JavaScript] 호이스팅 호이스팅이란? 일반명사) 끌어 올리기 고유명사) 선언한 위치와 상관없이 함수, 변수의 선언부를 인접한 스코프의 최상단으로 끌어올려 스코프 내 어디서든 해당 식별자를 관측할 수 있는 현상 호이스팅은 어떻게 발생하는가? 하지만 자바스크립트 엔진은 실제로 코드를 실행하는 시점에 함수, 변수의 선언부를 인접한 스코프의 최상단으로 끌어올릴 만한 능력이 없다. 단지 코드 실행 전에 어떤 과정을 거쳐서 변수, 함수에 대한 전체적인 정보를 미리 알고 있을 뿐이다. 여기서 말하는 어떤 과정이란 참고) 자바스크립트는 코드 실행 전 따로 컴파일 과정을 거친다. 컴파일 : 사람이 이해하는 언어로 이루어진 코드를 컴퓨터가 이해할 수 있도록 쪼개고, 체계적인 구조로 재가공하여 전체를 분석하는 일련의 과정 자바스크립트 엔진은 코드.. 공감수 0 댓글수 0 2022. 11. 5.
[JavaScript] 실행 컨텍스트 실행 컨텍스트(Execution Context) 란? 실행할 코드에 제공할 환경 정보들을 모아 놓은 객체이다. 전역 코드 : 전역 영역에 존재하는 코드 함수 코드 : 함수 영역에 존재하는 코드 일반적으로 실행할 코드는 전역 코드와 함수 내 코드이다. 자바스크립트 엔진이 코드를 실행하기 위해 필요한 모든 정보를 하나의 객체로 묶어 놓은 것이다. 실행 컨텍스트 생성 과정 1. 실행 컨텍스트 생성 2. 스코프 체인의 생성과 초기화 실행 컨텍스트가 생성된 이후 가장 먼저 스코프 체인의 생성과 초기화가 실행된다. 이때 스코프 체인은 전역 객체의 레퍼런스를 포함하는 리스트가 된다. 3. 변수 객체화 실행 스코프 체인의 생성과 초기화가 종료하면 변수 객체화가 실행된다. 변수 객체화는 변수 객체에 변수, 매개변수와 인.. 공감수 0 댓글수 0 2022. 11. 5.
[JavaScript] 스코프(Scope) 스코프란? 일반명사) 유효 범위 고유명사) 참조하려는 대상의 식별자를 찾아내기 위한 규칙 변수는 어디에 저장되어 있는가? 필요할 때 프로그램은 어떻게 변수를 찾는가? 특정 장소에 변수를 저장하고 나중에 그 변수를 찾는데는 잘 정의된 규칙이 필요하다. 이런 규칙을 “스코프(Scope)” 라고 한다. 식별자 이름으로 변수를 찾기 위한 규칙의 집합 스코프는 크게 2가지로 구분할 수 있다. 전역 스코프 : 코드 어디서든 참조할 수 있는 스코프. 지역 스코프 : 함수 코드 블록이 만든 스코프로 함수 자신과 그 하위 함수에서만 참조할 수 있는 모든 변수는 반드시 스코프를 갖는다. 전역 변수 : 전역에서 선언된 변수이며 전역 스코프를 가지므로 코드 어디서든 참조할 수 있는 변수 지역 변수 : 지역 내에서 선언된 변수.. 공감수 0 댓글수 0 2022. 11. 5.
[JavaScript] 런타임 메모리 구조 런타임이란? 일반명사) 컴퓨터 프로그램 실행을 돕는 소프트웨어 고유명사) 특정 언어로 만든 프로그램들을 실행할 수 있는 환경(프로그램) 왜 사용하는가? 프로그래밍 언어로 작성된 프로그램을 실행하기 위해서 JavaScript 런타임 JavaScript 가 구동되는 환경 종류로는 브라우저(크롬, 파이어폭스, 익스플로러 등) 프로그램과 Node.js 라는 프로그램이 있음. JavaScript 엔진의 구성 : Memory Heap 과 CallStack 으로 구성되어 있음. 콜스택(CallStack) 실행 콘텍스트(Execution Context) 를 통해 원시 타입 데이터(정수, 실수, 문자, boolean 등) 가 저장된다. 함수의 호출부도 여기에 저장된다. 메모리 힙(Memory Heap) 참조 타입(객체 .. 공감수 1 댓글수 0 2022. 11. 5.
[JavaScript] 변수 선언 방식 (var/ let/ const) var / let / const 란 무엇인가? JavaScript 에서 변수 선언 시에 사용하는 예약어(키워드) 예약어(키워드) : 컴퓨터 프로그래밍 언어에서 이미 문법적인 용도로 사용되고 있기 때문에 식별자로 사용할 수 없는 단어들 1. var ES6(ECMAScript6) 이전에 변수 선언 방식이다. 변수 선언 및 초기화 후에 값을 재할당할 수 있다. 동일한 변수명으로 중복 선언이 가능하다. 예시) // 첫 번째 변수 선언 + 초기화 var a = 10; console.log(a); // 결과값: 10 // 값 재할당 a = 20; console.log(a); // 결과값: 20 // 두 번째 변수 선언 + 초기화 var a = 30; console.log(a); // 결과값: 30 // 세 번째 변.. 공감수 0 댓글수 0 2022. 11. 5.
[JavaScript] Primitive Type(원시 타입) 과 Reference Type(참조 타입) 자바스크립트의 자료형은 크게 원시 타입 과 참조 타입 으로 나뉜다. 원시 타입 (Primitive Type) 모두 하나의 값을 담고 있다. 값 자체에 대한 변경이 불가능(immutable) 하다. 예시) let myString = "hello"; myString[0] = 'B'; // 원시 타입이기 때문에 Bye 로 변경 불가능. 오류는 Throw 되지 않는다. console.log(myString); // bye 변수에 데이터를 재할당할 수 있다. 예시1) 문자열을 담고 있던 변수에 다른 문자열을 담을 수 있다. let myString = "hello"; myString = "bye"; // 재할당 가능 console.log(myString); // bye 예시2) 문자열을 담고 있던 변수에 숫자를 담.. 공감수 1 댓글수 0 2022. 11. 5.
[JavaScript] 자바스크립트 언어의 특징 자바스크립트의 특징 자바스크립트는 컴파일 언어이다. (자바스크립트는 코드 실행 전 코드 평가 과정을 거친다. 이 과정에서 선언된 모든 식별자에 대한 정보를 미리 수집해 메모리에 매핑시키는데, 이로 인해 코드 실행 시 호이스팅 문제가 발생한다.) 자바스크립트는 Lexical-Scoped 언어이다. (자바스크립트에서 함수 선언 시점에 스코프가 생겨나며, 함수를 선언하는 순간 함수 내부의 변수들은 자기 스코프로부터 가장 가까운 곳(상위 스코프에서) 에 있는 변수를 계속 참조하게 된다. 자바스크립트의 이런 특성으로 인해 생성되는 함수는 모두 클로저 함수라고 말할 수 있다.) 자바스크립트는 dynamically-typed 언어이다. (자바스크립트는 코드 실행 시점에 변수의 타입이 결정되고 변수 타입에 해당하는 메.. 공감수 0 댓글수 0 2022. 11. 5.
[Tip] function 은 되도록 사용하지 마세요. 다양한 곳에서 사용되어 오히려 헷갈리는 기존 function 키워드 예시 1) 일반 함수로 활용 출력 결과는 다음과 같습니다. 여기서 this 는 window 를 가리킵니다. 예시 2) 생성자 함수로 활용 출력 결과는 다음과 같습니다. 여기서 가리키는 this 는 Func 클래스에 의해 만들어진 인스턴스입니다. this 가 windows 가 아니기 때문에 func 라고 하는 인스턴스에 프로퍼티 args 를 만들어서 거기에 배열을 담고 있게 됩니다. 예시 3) 객체 메소드로 활용 출력 결과는 다음과 같습니다. 객체에 있는 메소드를 실행했을 때 this 는 . 앞에 있는 bar 가 됩니다. 위와 같이 function 키워드는 일반 함수로도 객체 생성자 함수로도 객체 메서드로 활용될 수 있다 보니 범용적으로 .. 공감수 0 댓글수 2 2022. 11. 4.
[JavaScript] for, foreach, filter, map, reduce 기능 및 퍼포먼스의 차이 들어가며 나는 평소 백엔드 API 로부터 응답받은 데이터를 가져와 화면에 보여줄 때 forEach 함수를 자주 사용하곤 했다. for 문에 비해 가독성이 좋아서 forEach 를 사용했었다. 이외에도 케이스에 따라 filter, map, reduce 등을 사용하곤 했었다. 하지만 이들의 퍼포먼스 차이에 대해서는 아직까지 찾아본 적이 없었다. 오늘 백준에서 이진 탐색 알고리즘 문제를 풀던 중 filter, reduce 메서드 등을 사용하게 되었다. 코드가 올바르게 동작해 예상한 값이 출력되었지만, 메모리 초과로 계속 통과하지 못했다. 그러나, 이들 대신 forEach 메서드를 사용하니 메모리 초과 문제가 해결되며 통과했다. 이를 계기로 filter, reduce 메서드와 forEach 메서드가 어떤 퍼포먼.. 공감수 1 댓글수 2 2022. 9. 24.
[Typescript] Builder Pattern 들어가며 개발을 하면서 빌더 패턴에 대해서 정확히 알지 못한 상태로 사용 중이었다. 모르고 쓰는 것에 답답함을 느껴 찾아보게 되었다. 두고두고 볼 용도로 공부한 내용을 정리하고자 한다. Builder Pattern 이란? 클래스의 구축을 단순화하고, 사용자가 전문 지식 없이 클래스를 구축할 때 사용하는 패턴이다. 생성 패턴(인스턴스를 만드는 절차를 추상화하는 패턴)의 일종이다. 언제 쓰는가? “The builder pattern itself is used to separate the construction of complex object from its presentation.” - Wikipedia 예를 들어 함수가 여러 개의 인자를 받고 있고, 중간 중간에 null 값을 넘겨줘야 하는 인자가 있을 경.. 공감수 0 댓글수 0 2022. 8. 7.
Generator JavaScript에서 iterator 객체를 쉽게 구현할 수 있는 방법에는 Generator가 있습니다. Generator 란? Generators are functions that can be exited and later re-entered. Their context (variable bindings) will be saved across re-entrances. - MDN. Generator 의 특징 generator의 특징은 함수가 특정 지점에서 끝나고 다음 실행 때는 끝난 시점에서 다시 시작된다는 것입니다. function* () { // syntax; } 위처럼 *를 붙이는 함수는 generator가 됩니다. 이 함수는 특별한 함수인데 일반적인 함수와는 다르게 내부에서 yield라는 문법이 .. 공감수 0 댓글수 0 2020. 11. 23.
JavaScript와 Iterator ES2015에서 Iterable Protocol이 추가되었습니다. Iterable Protocol에는 2가지 형태가 존재하는데, iterable과 iterator가 있습니다. Iterable iterable은 객체의 멤버를 반복할 수 있는 객체입니다. iterable은 자바스크립트 객체의 요소들에 대해 반복되는 행동(예를 들어, for .. of 구문에서 어떤 값들이 루프를 돌고 있는가)을 정의할 수 있도록 해줍니다. JavaScript에서 객체가 iterable하기 위해서는, object에는 [@@iterator] 메서드가 구현되어 있어야 합니다. 따라서 임의로 우리가 객체를 만들고 iterable하게 만들고 싶다면, object 프로퍼티에 Symbol.iterator를 추가해야 합니다. 객체는 반드시.. 공감수 0 댓글수 0 2020. 11. 23.
Node와 Element HTML / XML 문서는 브라우저 안에서 DOM 트리로 표현됩니다. 태그는 요소 노드가 되고 트리 구조를 형성합니다. 문자는 텍스트 노드가 됩니다. 이 외에 HTML 내의 모든 것은 DOM을 구성합니다. 심지어 주석까지도 말입니다. HTML 안의 모든 것들은 (심지어 그것은 주석이더라도) 노드이고, 이 노드들이 모이고 서로 연결되어 DOM을 구성하고 있습니다. 노드의 종류 노드 타입은 총 12가지인데, 실무에서 주로 다음 네 가지 노드를 다룹니다. DOM의 '진입점'이 되는 문서(document) 노드 HTML 태그에서 만들어지며, DOM 트리를 구성하는 블록인 요소 노드(element node) 텍스트를 포함하는 텍스트 노드(text node) 화면에 보이지는 않지만, 정보를 기록하고 자바스크립트를 .. 공감수 0 댓글수 0 2020. 11. 22.
DOM, CSSOM, BOM은 무엇일가? 문서 객체 모델(DOM) 문서 객체 모델(Document Object Model, DOM)은 자바스크립트 Node 객체들의 계층화된 트리입니다. HTML 문서가 브라우저에 의해 해석되어 실제 문서를 나타내는 노드 객체들의 트리 구조로 변환된다는 것입니다. 이 객체는 수정 가능합니다. document 객체는 페이지의 기본 '진입점' 역할을 합니다. document 객체를 이용해 페이지 내 그 무엇이든 변경할 수 있고, 원하는 것을 만들 수도 있습니다. DOM의 목적은 자바스크립트를 사용해서 페이지 내 모든 요소들을 쉽게 조작(삭제, 추가, 바꾸기, 이벤트 처리, 수정)할 수 있도록 프로그래밍 인터페이스를 제공하는 것입니다. CSS 객체 모델(CSSOM) CSS 객체 모델(CSS Object Model, C.. 공감수 0 댓글수 0 2020. 11. 22.
자바스크립트 모듈(Module) 모듈(Module) 이란? 자바스크립트 코드의 크기가 갈수록 커지고 기능도 복잡해지면서 자바스크립트 커뮤니티는 코드 전체를 기능 단위의 코드 뭉치로 분해하고 필요에 따라 결합할 수 있도록 하는 시스템의 도입을 고민하였습니다. 그 결과 도입된 것이 바로 모듈 시스템(Module System)입니다. 이 때 사용되는 코드 뭉치 각각을 모듈(Module)이라고 합니다. 모듈은 대개 클래스 하나 혹은 특정한 목적을 가진 복수의 함수로 구성된 라이브러리 하나로 구성됩니다. 모듈 시스템은 2015년에 표준으로 등재되었습니다. 이 이후로 관련 문법은 진화를 거듭해 이제는 대부분의 주요 브라우저와 Node.js가 모듈 시스템을 지원하고 있습니다. 모듈 활용법 모듈에 특수한 지시자 export와 import를 적용하면 .. 공감수 0 댓글수 0 2020. 11. 21.
sort 함수를 이용한 정렬 arrayObj.sort(sortFunction) arrayObj는 임의의 Array 객체이며 sortFunction은 요소 순서를 결정하는 데 사용되는 함수이다. sort 함수를 이용하면 문자, 숫자, Object 정렬 등을 수행할 수 있다. 참고로 sort 함수는 원본 배열을 조작하여 정렬시킨다. 정렬된 새로운 배열을 새로 생성하지 않는다. 1. 문자 정렬 const arr = ["fff", "hhh", "aaa", "ccc"]; arr.sort(); console.log(arr); 일반적인 정렬 방식이며, 아스키코드 문자 순서로 정렬된다. 2. 숫자 정렬 위의 문자 정렬과 동일한 방법으로 숫자를 정렬하게 되면 아스키코드 순으로 정렬되므로 우리가 원하는 대로 숫자를 정렬되지 않는다. 그러므로, 숫자를.. 공감수 0 댓글수 0 2020. 11. 9.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.