개발Story
[javascript] 정규표현식
Javascript/문법 2022. 8. 28. 16:44

정규표현식은 "특정 패턴의 문자열"을 찾기 위한 표현 방식입니다. (이런걸 형식 언어, formal languange라고 합니다.) 형식 : /regex?/i 의미 : slashes(/) , patterns(regex?), slashes(/) , i (i) 슬러시 안에 패턴을 입력하여 원하는 특정 패턴을 찾으면 됩니다. 4가지 그룹으로 나눠서 보기. 연습용 사이트 : https://regexr.com/5ml92 Groups and ranges Character뜻 | 또는 () 그룹 [] 문자셋, 괄호안의 어떤 문자든 [^] 부정 문자셋, 괄호안의 어떤 문가 아닐때 (?:) 찾지만 기억하지는 않음 [patterns] 그룹으로 묶어서 찾기 ex) /gr(e|a)y -> gr로 시작하면서 e또는a로 시작하고y..

[javascript] optional chaining(?)
Javascript/문법 2022. 8. 28. 15:42

optional chaining 연산자 (?.) 는 체인의 각 참조가 유효한지 명시적으로 검증하지 않고, 연결된 객체 체인 내에 깊숙이 위치한 속성 값을 읽을 수 있다. ?. 연산자는 . 체이닝 연산자와 유사하게 작동하지만, 만약 참조가 nullish (en-US) (null 또는 undefined)이라면, 에러가 발생하는 것 대신에 표현식의 리턴 값은 undefined로 단락된다. 함수 호출에서 사용될 때, 만약 주어진 함수가 존재하지 않는다면, undefined를 리턴한다. 간단히 말하면 객체에 참조에러를 방지 할 수 있는 문법이다. [문법] : object key값앞에 ?를 붙여주어 error를 방지하면 된다. obj?.prop obj?.[expr] arr?.[index] func?.(args) 예..

[javascript] scroll event(등록, 삭제)
Javascript/문법 2022. 7. 31. 16:25

Web을 이용하는 중에 scroll을 내리다보면 데이터가 발생하는 경우가 종종 생긴다. javascript 'scroll'을 통해 event를 실행할 수 있다. 1. 첫번째 방법 : target.addEventListener에 scroll을 등록해 준다. let last_known_scroll_position = 0; let ticking = false; function doSomething(scroll_pos) { // scroll 위치에 대한 작업을 하세요 } window.addEventListener('scroll', function(e) { last_known_scroll_position = window.scrollY; if (!ticking) { window.requestAnimationFram..

[javascript] sort 함수.
Javascript/문법 2022. 6. 7. 17:17

javascript에는 배열요소를 정렬을 해주는 sort함수가 있다. sort의 사전전 의미는 "v : 분류하다. 구분하다. 정리하다. "이다. Array.prototype.sort() 구문 : arr.sort([compareFunction]) 예제 : 오름차순으로 정렬 var numbers = [4, 2, 5, 1, 3]; numbers.sort(function(a, b) { return a - b; }); console.log(numbers); // [1, 2, 3, 4, 5] 개체 속성으로 정렬 var items = [ { name: 'Edward', value: 21 }, { name: 'Sharpe', value: 37 }, { name: 'And', value: 45 }, { name: 'Th..

[Javascript] Slice, Splice, Split
Javascript/문법 2022. 5. 7. 12:40

코딩 테스트 문제를 푸는데 배열을 자르거나, 조합할 일이 많았다. 그럴때마다 문법을 찾아봤는데 이참에 정리를 해보려 한다. Slice() Slice()는 배열 메서드로 원하는 부분을 복사하고 새로운 배열을 리턴한다. 배열을 변경하지 않는것이 핵심이라고 한다. //loaf3과 loaf5를 새 배열에 복사하고 싶어욧.. let bread=['loaf1','loaf2','loaf3','loaf4','loaf5','loaf6']; newArr=bread.slice(2,5); //output:["loaf3", "loaf4", "loaf5"] Splice() Splice()또한 배열 메서드로 배열에 원하는 엘리먼트 갯수를 추가하거나 제거할 수 있다. 이는 기존 배열에 변이를 준다. let bread = ['loaf..

article thumbnail
[javascript ES6] reduce(누산기)
Javascript/문법 2022. 4. 23. 16:50

코딩테스트 문제를 접하면서 reduce함수를 활용한 경우가 많았다. reduce는 동사로 줄이다라는 뜻이다. javascript에서는 배열객체에서 사용하는 함수로 배열을 돌려서 줄여간다? 예제를 통해서 알아보자 Array.reduce() 예제 1) reduce() 메서드는 배열의 각 요소에 대해 주어진 reducer함수를 실행하고, 하나의 결과값을 반환한다. const array1 = [1, 2, 3, 4]; // 0 + 1 + 2 + 3 + 4 const initialValue = 0; const sumWithInitial = array1.reduce( (previousValue, currentValue) => previousValue + currentValue, initialValue ); conso..

[Javascript ES6] join
Javascript/문법 2022. 4. 2. 16:04

javascript join함수는 배열을 대상으로 사용하는 함수이다. 배열.join() 은 배열의 원소들을 연결하여 하나의 값으로 만든다. ex) let numbers = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine"]; let join1 = numbers.join(); console.log(jsoin1) //'zero,one,two,three,four,five,six,seven,eight,nine' let join2 = numbers.join('/'); console.log(join2); //'zero/one/two/three/four/five/six/seven/eight/nine' 파라미터에 인자를 넘겨주..

[Javascript ES6] Map
Javascript/문법 2022. 3. 2. 16:26

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Keyed_collections 키기반의 컬렉션 - JavaScript | MDN 이번 장에서는 입력된 키값을 기준으로 정렬되는 데이터의 집합(자료 구조)에 대해 소개 할 것이다. Map과 Set은 입력된 순서대로 반복적으로 접근 가능한 요소들을 포함하고 있다. developer.mozilla.org ECMAScript 6에서 값들을 매핑하기 위한 새로운 데이터 구조를 소개 하고 있다. 그중 하나인 Map객체는 간단한 키와 값을 서로 연결(매핑)시켜 저장하며 저장된 순서대로 각 요소들을 반복적으로 접근할 수 있도록 한다. var sayings = new Map(); sayings.set("dog", ..