본문 바로가기

JS37

Javascript Some, Every How to properly use Javascript Some 자바스크립트 Some, Every 사용하기 Some some() 메서드는 배열 안의 어떤 요소라도 주어진 판별 함수를 통과하는지 테스트한다. js Some example const array = [1, 2, 3, 4, 5] // checks whether an element is even const even = element => element % 2 === 0 console.log(array.some(even)) // expected output: true 배열의 요소 테스트, 하나라도 10보다 큰지 판별 function isBiggerThan10(element, index, array) { return element > 10 } ;[2,.. 2020. 9. 21.
detect iPhone X device with JavaScript 자바스크립트로 아이폰X 디바이스 감지하는 방법 IPhoneX Resolution 아이폰X 해상도 IPhone X : 1125 X 2436 IPhone XS : 828 X 1792 IPhone XMAX : 1242 X 2688 const iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream const ratio = window.devicePixelRatio || 1 const screen = { width: window.screen.width * ratio, height: window.screen.height * ratio, } const iosX = screen.width == 1125 && screen.height === 2436.. 2020. 9. 21.
replace & replaceAll 문자열 치환하기 replace를 replaceAll 처럼 사용하여 문자열 치환하는 방법 //#를 공백으로 변경 str.replace("#", "") //첫번째만 공백으로 변경되고 나머지는 변경 되지 않는다. 정규식 이용해서 gi 로 감싸기 // #를 감싼 따옴표를 슬래시로 대체하고 뒤에 gi 를 붙이면 // replaceAll 과 같은 결과를 볼 수 있다. str.replace(/#/gi, "") 슬래시 / 바꾸기 ;/[/]/g 여러 문자 바꾸기 ;/[/,#,;,*]/g 정규식의 gi 의미 g : 발생할 모든 pattern에 대한 전역 검색 i : 대/소문자 구분 안함 m: 여러 줄 검색 (참고) 2020. 9. 21.
Slice & Splice slice 와 splice 차이 및 사용방법 slice begin 부터 end까지 (end 미포함) end 생략시 : 배열의 끝까지 ( length) 음수 : ex) slice(2, -1) 세번째부터 끝에서 두번째 요소까지 const animals = ["ant", "bison", "camel", "duck", "elephant"] console.log(animals.slice(2)) // expected output: Array ["camel", "duck", "elephant"] console.log(animals.slice(2, 4)) // expected output: Array ["camel", "duck"] splice 배열의 기존 요소를 삭제 교체 추가 const months = ["Jan".. 2020. 9. 21.
JS Pattern IIFE: Immediately Invoked Function Expression Self-Executing Anonymous Function 으로 알려진 디자인 패턴 즉시 실행 함수 표현: 정의되자마자 즉시 실행되는 Javascript Function ;(function() { statements })() 괄호((), Grouping Operator)로 둘러싸인 익명함수(Anonymous Function) 전역 스코프에 불필요한 변수를 추가해서 오염시키는 것을 방지, IIFE 내부안으로 다른 변수들이 접근하는 것을 막을 수 있는 방법이다. 즉시 실행 함수를 생성하는 괄호() 자바스크립트 엔진은 함수를 즉시 해석해서 실행한다. // 표현 내부의 변수는 외부로부터의 접근이 불가능하다. ;(function(.. 2020. 9. 21.
currentTarget Target 차이 currentTarget Target 차이 Difference Property Click the inner square Click outside of the inner square currentTarget Outer square Outer square target Inner square Outer square currentTarget 이벤트가 바인딩 된 요소 the element that the event was bound to. It never changes. In the sample code above, e.currentTarget is the element. target 사용자가 클릭 한 요소 사용자가 정확히 클릭하는 위치에 따라 원래 요소 또는 하위 요소가 될 수 있다. the element us.. 2020. 9. 21.
JS Map, Filter, Reduce How to properly use Javascript Map, Filter, and Reduce 자바스크립트 고차함수 map, filter, reduce 사용하기 Sample Player list Array const players = [ { id: 10, name: "Jan Vertonghen", status: "Goal keeper", totalMatch: 400, retired: true, }, { id: 2, name: "Paulo Wanchope", status: "Attacker", totalMatch: 200, retired: false, }, { id: 41, name: "Ronny Johnsen", status: "Goal keeper", totalMatch: 300, retired: .. 2020. 9. 21.