본문 바로가기
반응형

Language/JavaScript94

[JavaScript] window.print() - 프린트 실행 및 프린트 실행 이전/이후 시점 제어하기 스크립트에는 window.print() 라는 메서드가 존재하는데, ctrl + p 와 동일한 기능을 제공하는 프린트 기능이다. ▷ 구문 window.print() 사실 프린트 기능만을 정리하자면 제목에 있는것처럼 window.print()만 있으면 가능하지만 당연하게도 개발을 진행하게되면 여러 상황에 직면하게 되는데 이때 유용하게 도와줄 수 있는 프린트 실행 이전/이후 시점의 처리를 도와줄 방법에 대해서도 알아보자. ▷ 예제1) window.onafterprint / window.onbeforeprint window.onbeforeprint = function () { console.log("onbeforeprint : 프린트 이전에 실행"); } window.onafterprint = function .. 2021. 1. 2.
[JavaScript] arr.some() - 배열에 존재하는 값이 특정 조건을 "단 한개"라도 만족하는지 판별하는 함수 (ft. 반복문) Array.prototype.some() 이라는 배열 메서드는 대상 배열에 특정 조건에 만족하는게 "단 하나"라도 존재하는지 확인하는 메서드이다. ▷ 구문 arr.some(callback(curentValue, index, array)[, thisArg]) callback : function 안에서 조건에 맞는게 하나라도 있는지 체크하며, true/false를 반환한다. curentValue: 현재 요소 (ex. 반복문의 현재 요소) index : 현재 요소의 인덱스 array :대상 배열 thisArg : callback을 실행할 때 this로 사용하는 값. 예제를 통해 some() 메서드에 대해 알아보자. ▷ 예제1) var array = [0,1,2,3,4] array.some(function(el.. 2020. 12. 16.
[JavaScript] Object.values() - 객체의 value 값들만 뽑아내기 객체에 담아서 사용하다보면 key값들만 뽑아서 사용하거나 value값들만 뽑아서 사용해야하는 경우가 생긴다. 배열에 돌려서 하나하나 뽑아 쓰기 보다는 스크립트에는 Object.values() 라는 메서드를 제공해주는데 특정 객체를 대상으로 value값들만 뽑아서 배열로 반환하는 메서드라 생각하면 된다. ▷ 구문 Object.values(obj) : Object.values() 는 파라매터로 전달된 객체가 가지는 열거 가능한 속성의 값들로 구성된 배열을 반환합니다. 배열의 값들이 순서는 오브젝트의 속성을 for in 구문등으로 반복한 결과와 동일합니다. (참고로 for in 구문은 순서를 보장하지 않습니다) 예제를 통해 알아보자. ▷ 예제1) 숫자값들로 이루어진 객체 var obj = { a: 2, b: .. 2020. 12. 15.
[JavaScript] arr.filter() - 배열에서 원하는 배열값들만 추려내기/반환하기 (ft. Array.prototype.filter()) 스크립트로 배열을 다룰때 많은 값들을 가진 배열에서 원하는 조건에 맞는 값들만 뽑아내 사용하고 싶을때 Array.prototype.filter() 메서드를 사용하면 손쉽게 할 수 있다. 메서드 이름 그대로 배열에 필터링을 건다고 생각하면 쉽다. ▷ 구문 arr.filter(callback(element[, index[, array]])[, thisArg]) callback : callbackFunction 이며 function 안에서 조건에 따라 true를 반환하는 요소만 가지고 배열을 만들어준다. element : 현재 요소 (ex. 반복문의 현재 요소) index : 현재 요소의 인덱스 array : filter 함수를 사용하는 대상 배열 thisArg : callback을 실행할 때 this로 사용.. 2020. 12. 15.
[JavaScript] Math.(round/ceil/floor) - 반올림/올림/내림 스크립트에는 수학에서 자주 사용하는 상수와 함수들을 미리 구현해 놓은 내장 객체인 Math 객체가 존재한다. Math 객체 안에는 아주 다양한 메서드가 존재하는데 그 중에서 우리는 흔히 쓰이는 반올림(round)/올림(ceil)/내림(floor) 메서드에 대해 알아보고자 한다. ▷ 구문 Math.round(num) : 반올림 Math.ceil(num) : 올림 Math.floor(num) : 내림 예제를 통해 알아보자. ▷ 예제1) Math.round() Math.round(7.5); //8 Math.round(7.4); //7 Math.round(7.48); //7 Math.round(-7.5); //-7 Math.round(-7.6); //-8 ▷ 예제2) Math.ceil() Math.ceil(6... 2020. 12. 15.
[JavaScript] indexOf() - 문자열 및 배열에서 특정 값의 위치(인덱스) 찾기 (ft. include() 대체 메서드) 문자열 또는 배열에서 특정 값의 위치를 파악해야하여 사용하는 경우가 많은데 찾고자하는 특정 값의 인덱스(위치)값을 알려주는 indexOf() 메서드에 대해 알아보고자 한다. 제목과 마찬가지로 배열 또는 문자열에서 사용 가능한 메서드이며 각각 String.prototype.indexOf() 와 Array.prototype.indexOf()를 의미한다. ▷ 구문 .indexOf( searchElement[, fromIndex] ) 첫번째 매개변수에는 찾고자 하는 값/요소 를 입력하고 (문자열의 경우 대소문자 구분) 두번째 매개변수는 생략이 가능하나 사용하고자 하면 시작 위치를 입력할 수 있다 기본값은 0이다. 예제를 통해 알아보자. ▷ 예제1) String.prototype.indexOf() var str .. 2020. 12. 14.
[JavaScript] includes() - 문자열 및 배열에 특정 요소를 포함하고 있는지 판별/확인 하기 스크립트를 사용하는 중에 배열 또는 문자열에서 어떠한 특정 값이 존재하는지 확인해야하는 경우가 생기는데ES6에서 추가된 includes() 메서드에 대해 알아보고자 한다. 제목과 마찬가지로 배열 또는 문자열에서 사용 가능한 메서드이며각각 String.prototype.includes() 와 Array.prototype.includes()를 의미한다. ▷ 구문.includes( valueToFind[, fromIndex] ) 첫번째 매개변수에는 찾고자 하는 값을 입력하고 (문자열의 경우 대소문자 구분)두번째 매개변수는 생략이 가능하나 사용하고자 하면 시작 위치를 입력할 수 있다 기본값은 0이다. 예제를 통해 알아보도록 하자.▷ 예제1) String.prototype.includes()let str = 'i.. 2020. 12. 14.
[JavaScript] 특정 값이 숫자인지 체크하기 (ft. isNaN() / Number.isNaN()) - 특정 값이 숫자가 맞는지 확인하기- 특정 값이 숫자가 맞는지 체크하기 위해서 자바스크립트에서 제공해주는 isNaN() 메서드가 존재한다. 예제를 통해 쉽게 접근해보자. ▷예제1) isNaN("123") //false isNaN("abc") //true 메서드 안에 숫자를 넣었는데 false가 나오고 문자를 넣었는데 true가 나온게 이상해 보일수는 있으나 NaN이 의미하는 것은 Not a Number 이기 때문에 메서드의 매개변수가 숫자일 경우 false, 숫자가 아닐경우 true를 반환한다. 이렇게보면 숫자인지만 체크하는게 아니라 문자도 체크하는것으로도 볼 수 있는데 isNaN() 메서드는 좀 일반적이지 않은 규칙을 가지고 있으므로 조심해서 사용하는게 좋다. 그래서 나온게 제목에 있는것처럼 Numb.. 2020. 12. 7.
[JavaScript] arr.(push/pop/unshift/shift) - 배열 데이터 추가 및 삭제 하기 배열 데이터를 다루는 Array.prototype.push(), Array.prototype.pop(), Array.prototype.shift(), Array.prototype.unshift() 메서드에 대해 알아보자. 앞서 arr.splice() 메서드를 통한 배열 값 추가 삭제에 대해 알아봤는데, splice() 메서드도 알아두면 좋다. ▷ 배열 요소 추가하기 (Array.push(), Array.unshift()) var mine = [0,1,2]; mine.push(3); // 배열의 마지막에 요소를 추가 // mine = [0,1,2,3] var mine = [0,1,2]; mine.unshift(3); // 배열의 앞쪽에 요소를 추가 // mine = [3,0,1,2] ▷ 배열 요소 삭제하기.. 2020. 11. 11.
반응형
TOP