[JavaScript] 구조 분해 할당(Destructuring)
Language/JavaScript2024. 4. 21. 13:34[JavaScript] 구조 분해 할당(Destructuring)

📚 구조 분해 할당이란 무엇인가요? 구조 분해 할당은 복잡한 배열이나 객체로부터 데이터를 추출하여, 이를 새로운 변수에 간단히 할당하는 자바스크립트의 표현식이에요. 이 방식을 사용하면 코드를 더 깔끔하고 가독성 있게 작성할 수 있어요. 비유를 들어보자면, 한 상자에 여러 가지 과일이 들어 있을 때, 각 과일을 하나씩 꺼내서 따로따로 접시에 담는 것과 비슷해요. 구조 분해 할당은 이러한 과정을 코드 상에서 매우 심플하게 해줍니다. 🖥️ 구조 분해 할당의 종류 구조 분해 할당은 주로 배열과 객체에서 사용돼요. 1. 배열의 구조 분해 할당 배열의 구조 분해 할당은 배열의 요소들을 변수에 할당할 때 사용돼요. 순서대로 할당되며, 원하는 요소만 선택적으로 추출할 수도 있어요. const fruits = ["사과"..

[JavaScript] 클로저
Language/JavaScript2024. 3. 23. 13:18[JavaScript] 클로저

📚 클로저란 무엇인가요? 클로저는 함수와 그 함수가 선언될 때의 렉시컬 환경과의 조합이에요. 이는 내부 함수가 외부 함수의 스코프에 접근할 수 있게 해 주며, 외부 함수가 실행을 마친 후에도 외부 함수의 변수에 접근할 수 있게 해요. 클로저는 '백팩'에 비유할 수 있어요. 함수가 실행될 때마다, 그 함수는 자신만의 '백팩'을 가지게 돼요. 이 '백팩' 안에는 함수가 생성될 때의 환경, 즉 외부 함수의 변수들이 들어 있어요. 함수가 어디로 가든, 이 '백팩'을 들고 다니면서 필요할 때마다 외부 함수의 변수들을 사용할 수 있게 되죠. 🖥️ 클로저의 사용 1. 데이터 은닉과 캡슐화 클로저를 사용하면, 함수 외부에서 접근할 수 없는 private 변수를 만들 수 있어요. 이는 데이터 은닉과 캡슐화를 가능하게 해..

[JavaScript] this
Language/JavaScript2024. 3. 18. 00:32[JavaScript] this

📚 this란 무엇인가요? 자바스크립트에서 this는 현재 실행 컨텍스트의 객체를 가리키는 키워드예요. 함수나 메서드가 어떻게 호출되었느냐에 따라 this의 값이 결정돼요. this를 사용하는 것은 마치 레스토랑에서 웨이터가 주문을 받는 고객을 정확히 알아야 하는 것과 비슷해요. 여기서 웨이터는 자바스크립트 함수이고, 고객은 this가 가리키는 객체예요. 어떤 테이블(컨텍스트)에서 호출되었는지에 따라, 웨이터(함수)는 다른 고객(this)에게 서비스를 제공하게 돼요. 🖥️ this의 사용 1. 전역 컨텍스트에서의 this 전역 컨텍스트에서 this는 전역 객체를 가리켜요. 브라우저에서는 window, Node.js에서는 global 객체가 돼요. console.log(this.document === wi..

[JavaScript] ES6
Language/JavaScript2024. 1. 25. 15:43[JavaScript] ES6

📚 ES6란 무엇인가요? ES6, 공식적으로는 ECMAScript 2015라고 불리는 이 업데이트는 2015년에 발표되었어요. 자바스크립트를 표준화하는 ECMAScript 사양의 여섯 번째 주요 버전이죠. ES6는 자바스크립트 언어에 많은 새로운 기능과 개선사항을 도입했어요. 이러한 변화는 개발자들이 더 효율적이고 간결한 코드를 작성할 수 있게 도와줘요. ES6는 마치 스마트폰이 이전의 피처폰에 비해 가진 혁신적인 기능들처럼, JavaScript의 코딩 경험을 획기적으로 개선한 것으로 볼 수 있어요. 🖥️ ES6의 새로운 기능들 1. let과 const var 대신 let과 const를 사용하여 변수를 선언할 수 있어요. 이는 블록 스코프 변수를 가능하게 하며, 코드를 더 안전하고 이해하기 쉽게 만들어줘..

[프로그래머스] 다항식 더하기 (JavaScript 문제 풀이)
CS/Algorithm2023. 12. 25. 22:05[프로그래머스] 다항식 더하기 (JavaScript 문제 풀이)

📝 문제 설명 한 개 이상의 항의 합으로 이루어진 식을 다항식이라고 합니다. 다항식을 계산할 때는 동류항끼리 계산해 정리합니다. 덧셈으로 이루어진 다항식 polynomial이 매개변수로 주어질 때, 동류항끼리 더한 결괏값을 문자열로 return 하도록 solution 함수를 완성해보세요. 같은 식이라면 가장 짧은 수식을 return 합니다. 🔍 제한사항 0 < polynomial에 있는 수 < 100 polynomial에 변수는 'x'만 존재합니다. polynomial은 양의 정수, 공백, ‘x’, ‘+'로 이루어져 있습니다. 항과 연산기호 사이에는 항상 공백이 존재합니다. 공백은 연속되지 않으며 시작이나 끝에는 공백이 없습니다. 하나의 항에서 변수가 숫자 앞에 오는 경우는 없습니다. " + 3xx + ..

[프로그래머스] 직사각형 넓이 구하기 (JavaScript 문제 풀이)
CS/Algorithm2023. 12. 21. 16:03[프로그래머스] 직사각형 넓이 구하기 (JavaScript 문제 풀이)

📝 문제 설명 2차원 좌표 평면에 변이 축과 평행한 직사각형이 있습니다. 직사각형 네 꼭짓점의 좌표 [[x1, y1], [x2, y2], [x3, y3], [x4, y4]]가 담겨있는 배열 dots가 매개변수로 주어질 때, 직사각형의 넓이를 return 하도록 solution 함수를 완성해보세요. 🔍 제한사항 dots의 길이 = 4 dots의 원소의 길이 = 2 256 < dots[i]의 원소 < 256 잘못된 입력은 주어지지 않습니다. 📥 입출력 예 dots result [[1, 1], [2, 1], [2, 2], [1, 2]] 1 [[-1, -1], [1, 1], [1, -1], [-1, 1]] 4 💻 나의 풀이 가로 길이 구하기: x 좌표들 중 최대값과 최소값의 차이를 구합니다. 세로 길이 구하기:..

[프로그래머스] 문자열 계산하기 (JavaScript 문제 풀이)
CS/Algorithm2023. 12. 19. 19:26[프로그래머스] 문자열 계산하기 (JavaScript 문제 풀이)

📝 문제 설명 my_string은 "3 + 5"처럼 문자열로 된 수식입니다. 문자열 my_string이 매개변수로 주어질 때, 수식을 계산한 값을 return 하는 solution 함수를 완성해주세요. 🔍 제한사항 연산자는 +, -만 존재합니다. 문자열의 시작과 끝에는 공백이 없습니다. 0으로 시작하는 숫자는 주어지지 않습니다. 잘못된 수식은 주어지지 않습니다. 5 ≤ my_string의 길이 ≤ 100 my_string을 계산한 결과값은 1 이상 100,000 이하입니다. my_string의 중간 계산 값은 -100,000 이상 100,000 이하입니다. 계산에 사용하는 숫자는 1 이상 20,000 이하인 자연수입니다. my_string에는 연산자가 적어도 하나 포함되어 있습니다. return type..

[Web] API
Web2023. 12. 18. 14:51[Web] API

📚 API란 무엇인가요? API(Application Programming Interface)는 간단히 말해, 서로 다른 소프트웨어나 시스템 간에 정보를 주고받을 수 있도록 하는 '중개자' 같은 역할을 하는 도구예요. API를 이해하기 쉬운 비유로 설명하자면, 레스토랑의 웨이터에 비유할 수 있어요. 레스토랑에서 손님은 주방장과 직접 음식을 주문하거나 대화하지 않아요. 대신, 웨이터를 통해 주문을 하고, 웨이터는 주방장에게 주문을 전달해요. 마찬가지로, 웨이터는 주방장이 만든 음식을 손님에게 가져다줘요. 여기서 웨이터가 API의 역할을 해요. 컴퓨터 프로그래밍에서 API는 한 프로그램이 다른 프로그램의 기능이나 데이터를 사용할 수 있게 해주는 '중개인'이에요. 예를 들어, 소셜 미디어 플랫폼의 API를 사..

반응형
image