본문 바로가기

javascript7

정규 표현식 - RegExp 문자클래스 리터럴 문자를 대괄호로 감싸서 문자클래스를 만들수 있음. 문자 클래스는 그 안에 포함된 문자 중 어떤 것과도 일치. /[abc]/ : a,b,c 모두와 일치 대괄호 안에 포함된 문자를 제외한 나머지 문자와 일치시키는 부정 문자 클래스 ^ (캐럿) /[^abc]/ : a,b,c 를 제외한 모든 문자와 일치 문자 클래스 안에서 하이픈을 써서 문자 범위 표현 /[a-zA-Z0-9]/ : 알파벳 대소문자와 숫자 전체와 일치 /[a-zA-Z0-9-]/ : 알파벳 대소문자와 숫자 전체, 하이픈과 일치 정규 표현식에서 특히 자주 사용되는 문자 클래스는 특수 문자와 이스케이프 시퀀스로 짧게 쓸 수 있음. 문자 일치하는 문자 [...] 대괄호 안에 있는 어떤 문자에든 일치 [^...] 대괄호에 포함되지 않은 .. 2022. 6. 20.
콜백 함수, promise, async await 그리고 동기와 비동기 브라우저 동작방식 가끔 가다 javascript 는 비동기적 실행이 되는 (병렬처리가 되는) 언어다 라고 하는 사람들이 있는데 javascript는 동기적으로 실행 되는 프로그래밍 언어임. 비동기적으로 코드를 실행해주는 키워드들이 있긴하지만 자바스크립트는 동기적으로 동작함. 예를들면 setTimeout 함수나 eventListener, ajax 요청 등과 같이 오래 걸리는 애들은 비동기적으로 처리됨. 근데 이건 자바스크립트가 얘네를 비동기적으로 처리하는게 아니라 브라우저가 그렇게 처리해주는 것. 무슨말인지 이해하려면 브라우저가 작동하는 원리를 알아야 하는데 예를들어 이런 코드를 실행한다고 가정하자. const a = 2; const b = 3; const c = 4; console.log(a); setT.. 2022. 3. 30.
array, object 콘솔에서 출력할 때 신기한 점 - console lazy evaluation 여러분들 이 코드 간단하니까 한번만 보세여 자바스크립트는 코드를 위에서부터 한줄 한줄씩 해석하고, sort함수는 원본 배열을 바꿔버리니까 상식적으로 생각해보면 1번 콘솔로그는 원본 items 를 출력하고 2번 콘솔로그는 sort 된 items 를 출력할거 같지 않음 ? 근데요 콘솔에서 배열 펼쳐보면 같다고 나옴 엥? 콘솔 이새끼 이거 구라치네 내 언젠간 걸릴줄 알았다 여러분들 컴터는 거짓말 안함 그냥 입력되있는대로, 설정되있는대로 계산 해 줄뿐 그냥 내가 모르는거였음 여기에 Array(6) i 되있는 부분에 하늘색 네모 안에 있는 i 에다가 마우스 올려보면 이런글이 나옵니다. 영어 이런거 잘 모르지만 대충 읽어보면 이 값은 처음 펼칠때 검사되었습니다. 값이 변했을 수 있습니다. 라고 하는거 같네요 이게 .. 2022. 3. 25.
js sort 함수로 정렬해버리기 sort() 로 문자정렬 array.sort() sort 함수는 배열에 있는 문자를 사전에서 글자순으로 나열해 주듯이 잘 정렬해주는 고마운 함수임. sort(function(a,b) { return a-b }) 로 숫자정렬 근데 쌩 sort() 만으로 배열에 있는 숫자를 정렬해보려고 하면 조금 이상함. 엥 이거 뭐냐 왜 2, 5, 8, 30 아님? 왜냐면 그냥 쌩 sort() 함수를 갖다 쓰면 사전에서 찾듯이 첫글자부터 비교하기 때문임. 그래서 숫자를 정렬할때는 콜백함수를 넣어야 함 콜백 함수를 왜 넣냐고 ? 그건 그냥 자바스크립트 만든사람이 그렇게 쓰랬음. 작동방식을 보자면은 =============================================== numbers = [5, 30, 2, 8].. 2022. 3. 24.
js this (javascript this)가 가리키는 3가지 먼저하는 요약 1. object 내의 method에서 쓰는 this 는 그 method 를 가지고 있는 object를 뜻한다. 2. constructor 안에서 쓰는 this 는 새로 생성되는 object 를 뜻한다. 3. 이벤트리스너 안에서의 this 는 e.currentTarget(지금 이벤트가 동작하는 곳) 을 뜻한다. * 화살표 함수 내부의 this 는 값을 변화시키지 않고 외부의 this 값을 그대로 재사용한다. 1. object 내의 method 에서 쓰는 this object 내의 method에서 쓰는 this 는 그 method 를 가지고 있는 object를 뜻한다. 우리가 global 함수를 만들면 사실 window 객체에 메서드를 만드는 것이므로 만약 globalFunc 라는 글로벌함수.. 2022. 3. 24.
for문 삼대장 - for ...of , for ...in, forEach 자 오늘은 헷갈리는 for문들을 정리해봅시다. 요약 일단 간단하게 먼저 정리하자면 for ... of, for ... in 은 반복문임다. forEach 는 반복을 해주지만 메서드임. for ... of 는 배열에 사용 (정확히는 array, string, arguments, nodeList, map, set 등의 iterable속성이 있는 애들) for ... in 은 주로 객체에 사용 (정확히는 enumerable 한 애들) forEach 메서드는 배열에 사용 객체 배열 대상 for ... of error 쌉파서블 컬렉션 for ... in 쌉파서블 파서블 객체의 모든 열거가능한 속성 forEach error 쌉파서블 컬렉션 왜 이렇게 되는지 자세히 알아봅시다. 1. for ... of 반복문 for.. 2022. 3. 10.