Study/JavaScript
-
sliceStudy/JavaScript 2020. 6. 24. 13:36
정의와 사용 slice() 메소드는 string의 부분을 추출하고 새로운 string에 추출된 부분을 리턴한다. 우리가 추출하기 원하는 string의 부분을 명료화하기위해 start와 end 매개변수를 사용한다. 첫번째 글자는 포지션이 0이다. 두번째는 1이다. 이런식으로 index값을 갖는다. 팁: 문자열 끝에서 부터 사용하려면 음수를 사용하라. 매개변수 값 Parameter Description start Required. The position where to begin the extraction. First character is at position 0. end Optional. The position (up to, but not including) where to end the extracti..
-
배열의 최소값 구하기:: for문 알아보기Study/JavaScript 2020. 6. 24. 11:48
Q. findSmallestElement 함수를 구현해 주세요. findSmallestElement 의 arr 인자는 숫자 값으로만 이루어진 array 입니다. array 의 값들 중 가장 작은 값을 리턴해주세요. 만일 array가 비어있으면 0을 리턴해주세요. 예를 들어, 다음과 같은 array이 인자(input)으로 들어왔다면: [20, 200, 23, 1, 3, 9] 1이 리턴되어야 합니다. 자바스크립트 for문을 이용해 위의 문제를 해결해보자. 그러려면 먼저 js의 for문에 대해 알아야 할 것이다. for문이란? for문이란 코드를 원하는 만큼 반복시킬 수 있다. for문에 실행 조건이 언제부터 언제까지 될 것이라고 알려주면 동작을 그 만큼 반복 할 수 있다. for문을 왜 사용하는가? 개발을 ..
-
web API :: NavigatorStudy/JavaScript 2020. 6. 13. 15:22
Navigator 인터페이스는 사용자 에이전트의 상태와 신원 정보를 나타낸다. 스크립트로 해당 정보를 질의할 때와 애플리케이션을 특정 활동에 등록할 때 사용한다. Navigator 객체는 window.navigator 읽기 전용 속성으로 접근할 수 있다. Navigator 속성 예 Navigator.geolocation : 장치의 위치에 접근을 허락하는 Geolocation 객체를 리턴한다. Navigator.cookieEnabled : 쿠키 설정이 무시될 경우 false를 반환하고 그렇지 않을 경우 true를 반환한다. NavigatorOnLine.onLine : 브라우저가 온라인인지 아닌지를 가리키는 Boolean을 리턴한다. 등등.. navigator의 다양한 속성들은 아래의 mdn 문서를 참고하자..
-
Array.from()Study/JavaScript 2020. 6. 13. 13:06
Array.from() 메서드는 유사 배열 객체(array-like object)나반복 가능한 객체(iterable object)를 얕게 복사해 새로운Array 객체를 만든다. console.log(Array.from('foo')); // expected output: Array ["f", "o", "o"] console.log(Array.from([1, 2, 3], x => x + x)); // expected output: Array [2, 4, 6] 구문 Array.from(arrayLike[, mapFn[, thisArg]]) 매개변수 arrayLike : 배열로 변환하고자 하는 유사 배열 객체나 반복 가능한 객체 mapFn : 배열의 모든 요소에 대해 호출할 맵핑 함수 thisArg : mapF..
-
forEach()와 map()의 차이점Study/JavaScript 2020. 6. 13. 11:58
공통점 forEach, map, reduce의 공통점은 "배열을 이용한다"는 점이다. 배열의 값을 조작해서 원하는 결과값을 도출하는데 의미가 있다. forEach()와 map()의 차이점 1. 새로운 배열을 반환하는 map() 다른 점을 알아보자. forEach()가 배열 요소마다 한 번씩 주어진 함수(콜백)를 실행하는 것과 달리, map()은 배열 내의 모든 요소 각각에 대하여 주어진 함수(콜백)를 호출한 결과를 모아 새로운 배열을 반환한다는 특징을 가지고 있다. 그리고, 그 함수는 1. currentValue (배열 원소의 값) 2. index (현재 요소의 인덱스) 3. array (현재 배열) 이 세 개의 인자를 가지고 호출된 다. 배열의 각 원소에 3을 곱하는 코드를 두 메서드의 특징에 맞게 짜..
-
원시값의 메서드Study/JavaScript 2020. 6. 10. 14:47
자바스크립트는 원시값(문자열, 숫자 등)을 마치 객체처럼 다룰 수 있게 해준다. 원시값에서도 객체에서처럼 메서드를 호출할 수 있다. 원시값의 메서드에 대해선 곡 학습할 예정인데, 그 전에 원시값은 객체가 아니라는 것을 상기하도록 하자. 원시값과 객체는 다음과 같은 차이점이 있다. 원시값: 원시형 값이다. 원시형의 종류는 문자(string), 숫자(number), bigint, boolean, symbol, null, undefined 형으로 총 7가지 이다. 객체 : 프로퍼티에 다양한 종류의 값을 저장할 수 있다. {name: "John", age: 30} 와 같이 대괄호{}를 사용해 만들 수 있다. 자바스크립트에는 여러 종류의 객체가 있는데 함수도 객체의 일종이다. 객체의 장점 중 하나는 함수를 프로퍼..
-
createElement()Study/JavaScript 2020. 6. 8. 15:38
HTML 문서에서 Document.createElement() 메서드는 지정한 tagName의 HTML 요소를 만들어 반환한다. tagName을 인식할 수 없으면 HTMLUnknownElement를 대신 반환한다. 구문 let element = document.createElement(tagName[, options]); 매개변수 tagName : 생성할 요소의 유형을 가리키는 문자열 options : is 속성 하나를 가진 ElementCreationOptions 객체. 속성의 값은 customElements.define() 을 사용해 정의한 사용자 정의 요소 입니다. 예제 아래 예제는 새로운 엘리먼트를 생성한 후, ID가 "div1" 인 요소 이전에 추가합니다. 위의 텍스트는 동적으로 추가했습니다. ..
-
정적 메서드와 정적 프로퍼티Study/JavaScript 2020. 6. 8. 11:03
"prototype"이 아닌 클래스 함수 자체에 메서드를 설정할 수도 있다. 이런 메서드를 정적(static)메서드라고 부른다. 정적 메서드는 아래와 같이 클래스 안에서 static 키워드를 붙여 만들 수 있다. class User { static staticMethod() { alert(this === User); } } User.staticMethod(); //true 정적 메서드는 메서드를 프로퍼티 형태로 직접 할당하는 것과 동일한 일을 한다. class User { } User.staticMethod = function(){ alert(this === User); }; User.staticMethod(); //true User.staticMethod()가 호출될 때 this의 값은 클래스 생성자인..