Loading...

[javascript] 중첩 배열 평탄하게 하기 (flat, concat, reduce)

javascirpt로 프론트엔드 코딩테스트 준비해야겠다 싶어서 공부하다가 배열을 평평하게 하는 방법을 다시 찾아보았다. 대표적으로 concat와 reduce, flat메서드를 쓸 수 있다. (flat메소드는 처음 봤다) 모든 결과는 [1,2,3,4,5,6]으로 동일하다. const arr=[1,2,[3,4],[5,6]]; const flattened=arr=>[].concat(...arr); const reduced=arr.reduce((acc,items)=>{ return acc.concat(items); },[]); const flatMethodUsed=arr.flat(); const test=[].concat(...arr); console.log(flattened(arr)); console.log(..

[Javascript Concept] typeof null===object 에 대한 고찰

javascript의 원시 타입이 뭐뭐 있었지? 하고 생각하다가 null을 보고 문득 생각이 들었다 null은 원시타입에 속하는데 왜 typeof null은 object이지? 만약 javscript의 타입을 모르는 사람이 있다면 javscript의 원시타입은 number, string, null, undefined, symbol, boolean 등이 있고 참조 타입에는 object, function, array 등이 있다. 두 타입의 차이점은 예전에 정리한 글이 있다(타입 별로 정리한 줄 알았더니 복사 얘기로 썼었네.. 한참 찾았다) 2020/10/27 - [자바스크립트_개념편] - [javascript] 얕은 복사 (참조 복사), 깊은 복사(값 복사) 찾아보니 typeof null의 결과가 object..

[Javascript] 자바스크립트 역사, 배경

예전에 노션에 정리했던게 있는데 다시 읽어보니 괜찮아서 옮겨적었습니다. 추후 다시 정리하고 내용 추가할게요 95년 90퍼 시장 점유율로 웹 브라우저 시장을 지배하던 넷스케이프 커뮤니케이션즈가 정적인 html을 동적으로 표현하기 위해 경량의 프로그래밍 언어를 도입하기로 결정 브랜던 아이크가 개발 넷스케이프의 웹 브라우저인 netscape navigator 2에 탑재되었고 mocha 로 명명된 후 livescript로 최종적으로 javascript로 명명됨 자바스크립트 탄생한 후 얼마지나지 않아 파생 버전인 JScript 가 출시되어 위기를 맞음 (javascript와 jscript가 독자적으로 각자의 브라우저에 다르게 개발되면서 브라우저에 따라 구현을 다르게 해야 되는 등 개발자들을 힘들게 했던 브라우저 ..

[JS] 스코프 Scope

스코프는 변수에 접근할 수 있는 범위 이다. 자바스크립트는 기본적으로 ES5까지는 함수 단위 스코프를 지원했고 ES6에 와서 블록 단위 스코프를 지원한다. var가 함수 단위의 스코프를 지원하고 let, const가 블록 단위 스코프를 지원한다. var, 함수 단위 스코프 if 나 for 문 같은 블록의 변수는 공유되나 함수 스코프 내의 변수는 공유하지 않는다. var a=1; // 전역 스코프 // if, for와 같은 블록은 같은 스코프라고 인식해서 블록을 지나도 해당 변수에 // 접근할 수 있다. if(true){ var a=2; } // 함수 내에서 선언된 변수는 함수 스코프를 지원하므로 함수 밖에서는 해당 변수에 // 접근할 수 없다. function test(){ var b=3; console..

[JS] Hoisting 호이스팅

아직 선언하지 않은 변수를 호출하더라도 undefined가 출력된다면? 이것이 바로 호이스팅 console.log(a); // undefined; console.log(test);//undefined; console.log(test2); // function test2 () {...} 저 밑에 선언한 함수가 출력된다 오잉 var a='호이스팅'; // 호이스팅 되는 var 변수 //함수 표현식은 호이스팅 되지 않지 하지만 var test 변수는 호이스팅 된다. var test=function(){ console.log('test'); } //호이스팅이 되는 함수 선언문..!! function test2(){ console.log('test2'); } 분명 변수를 선언하기 전에 호출 먼저 했는데도 에러가 ..

2020. 10. 27. 22:58

[javascript] this bind, this 바인딩(어렵다 어려워)

* boycoding.tistory.com/22?category=915176 jeonghwan-kim.github.io/2017/10/22/js-context-binding.html 글을 읽고 공부하며 요약정리한 글입니다 this는 함수가 호출되는 패턴에 따라서 다른 객체를 참조(바인딩) 한다 객체 메서드 호출: 메서드를 호출하는 객체에 바인딩 함수를 호출: 전역 객체에 바인딩 (내부 함수 호출 포함) 생성자 함수 호출: 새로 생성되는 객체에 바인딩 1. 객체 메서드 호출 const a={ name:'sara', output:function(){ console.log(this.name); } } const b={name:'b'} b.output=a.output a.output(); //sara 암시적 바..

2020. 10. 27. 00:54

[javascript] 얕은 복사 (참조 복사), 깊은 복사(값 복사)

출처: velog.io/@th0566/Javascript-%EC%96%95%EC%9D%80-%EB%B3%B5%EC%82%AC-%EA%B9%8A%EC%9D%80-%EB%B3%B5%EC%82%AC wanna-b.tistory.com/18 이 글은 위 글을 공부하면서 제가 기록한 글입니다. 자바스크립트 값의 타입은 원시 타입과 참조 타입이 있다 원시타입 참조타입 number string boolean null undefined object symbol 1. 깊은 복사, 값 복사 (Deep Copy, 실제로 새로운 변수와 값을 만들어내는 복사) 원시값은 새로운 배열에 같은 값을 새로 생성(!)해서 그 값을 새로운 변수에 할당한다 let a=100; let b=a; a=200; console.log(a); //2..

[You Don't know JS] part 2-1 스코프와 클로저 - 스코프란 무엇인가 정리

스코프 특정 장소에 변수를 저장하고 나중에 그 변수를 찾는데 정의된 규칙의 집합 컴파일러 자바스크립트는 사실 컴파일러 언어이다. (일반적으로 동적, 인터프리터 언어로 분류됨) 다른 전통적인 컴파일러 언어처럼 코드를 미리 컴파일하거나 그 결과를 분산 시스템에서 이용할 수는 없다 자바스크립트 엔진이 전통적인 컴파일러 언어에서 하는 컴파일러 역할을 대부분 처리한다 전통적인 컴파일러 처리 과정 소스코드가 실행되기 전에 보통 3단계를 거치는데, 이를 컴파일레이션이라고 한다 1. 토크나이징/렉싱 문자열을 나눠 토큰이라는 의미있는 조각으로 만드는 과정 var a=2; => var / a / = / 2 / ; 토크나이저가 상태 유지 파싱 규칙을 적용해 a가 별개의 토큰인지 다른 토큰 일부인지 파악한다면 그것은 렉싱이다..