[개발 공부]/[자바스크립트] 18

[자바스크립트] javascript some() 사용하기

[자바스크립트] javascript some() 사용하기 자바스크립트에서 for문의 남용을 막기위해 만들어낸 배열함수! 배열 요소 중, 조건에 만족하는 요소가 최소 하나라도 있는지 검사하는 메소드! (every() 와 반대되는 접근방식) 결과값은 true or false 로 반환한다! [사용법] //화살표 함수 표기법 array.some((element, index, array) => { ... }); //콜백함수로 호출하는 법 array.some(callbackFn, thisArg); //익명함수로 표기법 array.some(function(element, index, array) { }, thisArg); [간단설명] array.some() 은 배열을 순환하면서, 콜백함수의 조건에 "true" 인 요..

[자바스크립트] javascript filter() 사용하기

[자바스크립트] javascript filter() 사용하기 자바스크립트에서 for문의 남용을 막기위해 만들어낸 배열함수! 배열 요소 중, 어떠한 조건에 상응하는 모든 요소를 골라내고 싶다면 가장 알맞는 함수! 단, 결과 값은 배열로 리턴한다! [사용법] //화살표 함수 표기법 array.filter((element, index, array) => { ...}); //콜백함수로 호출하는 법 array.filter(callbackFn, thisArg); //익명함수로 표기 법 array.filter(function(element, index, array) { }, thisArg); [간단설명] array.filter() 는 배열을 순환하면서 콜백함수의 조건 "true" 인 모든 요소를 새로운 배열로 반환한..

[자바스크립트] javascript find() 사용하기

[자바스크립트] javascript find() 사용하기 자바스크립트에서 for문의 남용을 막기위해 만들어낸 배열함수! 배열 요소 중, 어떠한 조건에 맞는 첫번째 요소만 골라내고 싶다면 가장 알맞은 함수! [사용법] //화살표 함수 표기법 array.find((element, index, array) => { ... }); //콜백함수로 호출하는 법 array.find(callbackFn, thisArg); //익명함수로 표기법 array.find(function(element, index, array) { }, thisArg); [간단설명] array.find() 는 배열을 순환하면서 콜백함수의 조건에 만족하는 첫번째 배열요소를 반환한다. 만약 조건에 만족하는 요소가 없다면, undefined 를 re..

[자바스크립트] javascript map() 사용하기

[자바스크립트] javascript map() 사용하기 자바스크립트에서 for문의 남용을 막기위해 만들어낸 배열함수! 배열 요소를 순환하며 어떠한 가공을 가하거나, 배열요소 안의 요소를 추출하거나 할 때 가장 알맞은 함수! 가공된 결과물은 새로운 배열로 반환된다! [사용법] // 화살표 함수 array.map((element, index, array) => { ... }) // 콜백함수만 호출 array.map(callbackFn, thisArg) // 익명함수 array.map(function(element, index, array) { },thisArg) [간단설명] array.map()은 배열을 순환하면서 지정된 callback 함수를 각 요소마다 순서대로 실행하여 새로운 배열을 return 한다...

[자바스크립트] slice, splice, split 의 차이

[자바스크립트] slice() vs splice() vs split() 자바스크립트에서 제공하는 배열에 관련된 함수들로, 이름이 비슷하여 맨날 헷갈리는 친구들인데, 맨날 찾지말고 정리해보자 간단히, Slice(startIdx, endIdx) : 원본은 건들지 않고 배열 자르기 Splice(startIdx, number, elementToAdd) : 원본을 자르거나 추가하기 Split(separator, limit) : 문자열을 잘라서 배열로 변환 (문자열 => 배열) 1) slice() : 원본을 건들지않고, 복사된 array를 return! array.slice(startingIndex, endIndex); startingIndex : 시작 index endIndex : 끝 index (끝 index ..

[자바스크립트] Javascript This 정리

[자바스크립트] Javascript This 정리 자바스크립트에서 this 는 execution context 가 실행될 때에 정해진다. 실행 컨텍스트는 함수가 호출될 때에 실행되는데, 그 때에 this 가 binding 된다! 1) 전역공간 - this 는 window (전역객체) - node.js 에서는 global 이 나온다. 2) 함수 호출 시 - 전역객체가 호출됨 - 함수는 무조건 전역객체가 호출된다. 3) 메서드 호출 시 - 메서드를 호출한 주제 => a.b(); 에서 a가 this - 메서드란 원래 함수인데 어떤 객체와 관련된 동작을 하면 그것을 메서드라 부른다. 4) callback 호출 시 - 원래는 함수인 만큼 전역객체지만, call() 을 어떻게 호출하느냐에 따라 달라진다. - 함수로..

[자바스크립트] javascript for 문 정리

[자바스크립트] javascript for 문 정리 1) 기존 for문 : for(var i=0; i 가장 기본이지만 제일 정확한 방식인 것 같다. object / array 둘 다 순환이 가능! 2) for in 문 : var player = { name : 'Son', age : 30, position : 'forward', nationality : 'South Korea' } for(let key in player) { if(key.indexOf('age')) { console.log(player[key]); } } //console.log(player[key]) : 30 //객체(Object)를 순환할 때는 //보통 index 처럼 [0,1,2,3...] 이 아니라, //key 는 [name, a..

[자바스크립트] (함수의 표현) 함수 선언 후 undefined & hoisting 이란?

[자바스크립트] 함수 선언 후 undefined & hoisting 이란? 아래 예시를 참고하자 1)은 스크립트 순서와 상관없이 함수를 런타임 언제든 호출하여 사용이 가능하지만, 2)는 함수가 할당이 되는 그 시점까지의 스크립트를 지난 후에야 호출하여 사용이 가능하다. 1) 함수 선언문 function add(x,y) { return x+y } 2) 함수 표현식 (함수명 생략) var add = function(x,y) { return x+y } 함수 선언문은, 런타임 이전에 이미 일반변수와 같이 선언되어 '호이스팅'된다. 함수 표현식은, 런타임 이전에 undefined 로 변수를 초기화시키고, 런타임 시 해당 함수가 할당된다. 호이스팅(hoisting) 이란? => 끌어올림 실제로 일어나는 현상은 아니..