1. 웹개발/1_1_1 JavaScript 검색 결과

해당 글 26건

[Javascript] Generator(제너레이터) 사용법 및 예제

[Generator란?] Generator Function는 사용자의 요구에 따라 다른 시간 간격으로 여러 값을 반환할 수 있고 내부 상태도 관리할 수 있습니다. 단 한 번의 실행으로 함수의 끝까지 혹은 return까지 실행이 완료되는 일반 함수와는 달리, Generator 함수는 사용자의 요구에 따라 일시적으로 정지될 수도 있고, 다시 시작될 수도 있습니다. 또한 Generator 함수의 반환으로는 Generator가 반환됩니다. 함수에서 값을 여러 번에 걸쳐서 반환하는 것은 불가능합니다. 따라서 이 함수는 호출할 때마다 무조건 1을 반환하게 됩니다. function returnFunc() { return 1; return 2; return 3; return 4; return 5; } 하지만 제너레이터..
1. 웹개발/1_1_1 JavaScript 2022. 7. 31. 22:01

[Javascript] BOM이란?

브라우저 객체 모델(BOM)이란? Javascript를 이용하면 브라우저의 정보에 접근하거나 브라우저의 여러 기능들을 제어할 수 있습니다. 이때 사용할 수 있는 객체 모델이 바로 브라우저 객체 모델(BOM, Browser Object Model)입니다. 브라우저 객체 모델(BOM)은 문서 객체 모델(DOM)과는 달리 W3C의 표준 객체 모델은 아닙니다. 하지만 이 모델은 Javascript가 브라우저의 기능적인 요소들을 직접 제어하고 관리할 방법을 제공해 줍니다. 자바스크립트에서는 이러한 BOM 모델의 객체들을 전역 객체로 사용할 수 있습니다. Browser 객체 window 모든 객체가 소속된 객체이며, 브라우저 창을 의미합니다. document 현재문서에 대한 정보를 갖고 있는 객체입니다. histo..
1. 웹개발/1_1_1 JavaScript 2022. 6. 25. 01:32

[Javascript] Mobile인지 PC인지 확인하는 함수

가끔 코딩을 하다 보면 사용자가 PC이냐 Mobile이냐에 따라 다르게 분기 처리를 해야 할 때가 있습니다. 따라서 이번 글에서는 현재 사용자가 Mobile로 접근하고 있는지 PC로 접근하는지 확인하는 함수를 구현해보겠습니다. 정말 간단합니다. navigator라는 객체를 통해서 손쉽게 브라우저 정보를 확인할 수 있고 navigator는 전역 객체여서 개발자 도구를 켜시고 console에 navigator를 입력하면 바로 확인이 가능합니다. navigator에는 다양한 프로퍼티들이 있지만 저는 userAgent라는 프로퍼티를 이용해서 현재 pc에서 사용 중인지 mobile에서 사용 중인지 구분해 봤습니다. userAgent에 'iPhone'이라는 문구가 포함되어있다면 아이폰으로 접속했다는 것입니다. 마찬..
1. 웹개발/1_1_1 JavaScript 2022. 5. 12. 17:27

[Javascript] Set 정리 및 예제

Set은 흔히 집합이라고도 합니다. Set(집합)의 개념은 간단합니다. 유한하고 구분되는 객체들의 그룹입니다. 즉, 유일한(중복되지 않는) 항목들의 그룹입니다. 집합은 O(1) 상수 시간에 유일한 항목을 확인하고 추가할 수 있기 때문에 굉장히 중요합니다. 집합이 상수 시간 연산이 가능한 이유는 집합의 구현이 해시 테이블의 구현을 기초로 하기 때문입니다. 다음과 같이 자바스크립트에서는 Set이 기본으로 지원됩니다. 기본 Set 객체에는 속성이 하나만 존재하는 데 size라는 정수 속성입니다. 해당 속성은 집합 내 항목들의 현재 개수를 나타냅니다. const exampleSet = new Set(); [삽입] Set의 주요 특징은 유일함을 확인한다는 것입니다. Set은 항목들을 추가할 수 있지만 중복되는 항..
1. 웹개발/1_1_1 JavaScript 2022. 5. 5. 15:43

[Javascript] 빅오 표기법 정리 및 예제

알고리즘의 시간 복잡도를 f(n)이라고 표현했을 때, n은 입력의 개수를 나타내고 f(n)time은 필요한 시간을 나타내고 f(n)space는 필요한 공간(추가적인 메모리)을 나타냅니다. 알고리즘 분석의 목표는 f(n)을 계산함으로써 알고리즘의 효율성을 이해하는 것입니다. 하지만 f(n)을 계산하는 것은 어려울 수 있습니다. 이런 계산을 하는데 도움이 되는 빅오 표기법의 기본적인 규칙이 있습니다. [계수 법칙] 계수 법칙은 가장 이해하기 쉬운 법칙입니다. 단순히 입력 크기와 연관되지 않은 상수를 전부 무시하면 됩니다. 빅오에서 입력 크기가 클 때 계수를 무시할 수 있습니다. 상수 K>0인 경우 f(n)이 O(g(n))이면 kf(n)은 O(g(n))이다. 즉, 5f(n)과 f(n)이 모두 동일한 O(f(n..
1. 웹개발/1_1_1 JavaScript 2022. 4. 28. 21:54

[Javascript] 시간 복잡도 정리 및 예제

빅오 표기법은 알고리즘의 최악의 경우 복잡도를 측정합니다. 빅오 표기법에서 n은 입력의 개수를 나타냅니다. 알고리즘을 구현할 때 빅오 표기법이 해당 알고리즘이 얼마나 효율적인지 나타내기 때문에 빅오 표기법은 중요합니다. 빅오와 관련된 질문으로 "n이 무한으로 접근할 때 무슨 일이 일어날까?"가 있을 수 있습니다. [시간복잡도의 예] 1. O(1) - Constant Time O(1)은 입력 공간에 대해 변하지 않습니다. 따라서 O(1)을 상수 시간이라고 부릅니다. n의 값이 얼마나 크든 상관이 없습니다. O(1) 알고리즘의 예로 배열에 있는 항목을 인덱스를 사용해 접근하는 경우가 있습니다. function exampleConstant(arr) { console.log(arr[0]); } 2. O(n) -..
1. 웹개발/1_1_1 JavaScript 2022. 4. 27. 22:08

[Javascript] push() 대신 펼침 연산자로 원본 변경을 피하는 방법

원본 데이터를 조작하는 경우 예상치 못한 결과를 낳을 수 있습니다. 코드의 앞부분에서 컬렉션의 무언가를 수정하면 훨씬 더 찾기 어려운 버그를 만들 수 있습니다. 조작이 항상 문제를 일으키는 것은 아니지만 잠재적으로 문제가 되는 것은 사실이므로, 가능하면 조작을 피하는 것이 좋습니다. 실제로 리덕스를 비롯한 인기 있는 자바스크립트 라이브러리는 원본을 건드는(조작) 함수를 허용하지 않습니다. 모던 자바스크립트의 상당수가 함수형 프로그래밍 형식을 취하기 때문에 부수 효과와 조작이 없는 코드를 작성해야 합니다. 배열을 조작하기 위해 흔히 사용하는 push() 메서드는 새로운 항목을 배열 뒤에 추가해 원본 배열을 변경합니다. 즉, push로 항목을 추가하면 원본 배열을 조작하는 셈입니다. 하지만, 펼침 연산자를 ..
1. 웹개발/1_1_1 JavaScript 2022. 4. 21. 22:07

[Javascript] 커링(Currying) 함수란?

커링(Currying)은 함수의 재사용성을 높이기 위해 함수 자체를 return하는 함수입니다. 함수를 하나만 사용할 때는 필요한 모든 파라미터를 한 번에 넣어야 합니다. 커링을 사용하면 함수를 분리할 수 있으므로 파라미터도 나눠 전달할 수 있습니다. * 커링과 같이 함수 자체를 인자로 받거나 반환하는 함수를 '고차 함수' 라고 부르기도 합니다. [일반적인 함수] function add(num1, num2) { console.log(num1 + num2); } add(5, 8); // 13 [커링(Currying) 함수] 커링을 사용하면 num1 하나를 파라미터로 받고, 그 다음으로 num2를 파라미터로 받아서 함수를 재사용할 수 있습니다. function add(num1, num2) { return n..
1. 웹개발/1_1_1 JavaScript 2022. 1. 3. 12:52

[JavaScript] 실무에 유용한 Array API 함수들

1. make a string out of an array (배열을 문자열로만들기) const fruits = ['apple', 'banana', 'orange'] const result = fruits.join(); console.log(result); // 'apple,banana,orange' join() 메서드는 배열의 모든 요소를 연결해 하나의 문자열로 만듭니다. /** * Reverses the elements in an array in place. * This method mutates the array and returns a reference to the same array. */ 1-1. make an array out of a string (문자열을 배열로 만들기) const fru..
1. 웹개발/1_1_1 JavaScript 2021. 6. 11. 22:34

[JavaScript] function 정리 (ES6)

Javascript 함수(Function)에 대해 알아보겠습니다. 아래 doSum 함수는 함수를 선언한 것이고 보시면 num1, num2 인자를 받고 그 합을 반환해줍니다. 이와 같이 선언하여 사용할 수도 있고 아니면 printSum() 변수처럼 선언하고 변수에 함수를 대입하여 표현할 수도 있습니다. function은 Object입니다. 따라서, doSum.length, doSum.prototype 등의 프로퍼티들을 사용할 수 있습니다. function doSum(num1, num2) { // 함수 선언식 return num1+num2 } doSum(1, 2); // output = 3 const printSum = function(num1, num2) { // 함수 표현식, anonymous funct..
1. 웹개발/1_1_1 JavaScript 2021. 6. 8. 23:49

[JavaScript] toFixed()와 toPrecision() 메소드

toFixed() 메소드 Number 인스턴스의 소수 자릿수를 문자열로 반환합니다. 아래 예제를 보시면 쉽게 이해하실 수 있으실 것입니다. toPrecision() 메소드 Number 인스턴스의 가수와 소수를 합친 자릿수(즉, 앞자리부터)를 문자열로 반환합니다. 마찬가지로 아래 예제를 보시면 쉽게 이해하실 수 있습니다. Number 관련 메소드 2020/06/28 - [1. 웹개발/1_1_1 JavaScript] - [JavaScript] 전달된 값이 정수인지를 확인하는 isInteger() 메소드 2020/06/08 - [1. 웹개발/1_1_1 JavaScript] - [JavaScript] NaN인지를 확인하는 isNaN() 함수 2020/04/17 - [1. 웹개발/1_1_1 JavaScript] ..
1. 웹개발/1_1_1 JavaScript 2020. 6. 30. 20:37