all category

javascript

생존법칙1 reduce 메서드를 이해해라.

😎 reduce는 그냥 더하기 셔틀이 아니다. https://www.zerocho.com/category/JavaScript/post/5acafb05f24445001b8d796d https://www.zerocho.com/category/JavaScript/post/5acafb05f24445001b8d796d www.zerocho.com 이 글이 아주 감명 깊었다. 대부분의 배열 메서드는 약간의 수고를 들이면 reduce로 동일하게 구현해낼 수 있다. 즉 모든 배열 고차 함수들의 부모는 reduce나 다름없다.. 사실 reduce는 대부분 배열합계 구하기 셔틀로 사용하곤한다. 나 역시도 reduce를 가장 많이 사용하는 곳은 더하기 셔틀이다.. 하지만 reduce는 그 자유도가 높은 만큼 활용도 역시 아..

leetcode

169. Majority Element

😎간단한 문제입니다. 배열이 주어지고 그 배열에서 가장 많이 등장하는 값을 반환하면 되는 조건입니다. 키밸류쌍 자료구조를 통해 가장 등장횟수가 많은 키를 반환해주면 쉽게 풀 수 있겠네요 😎풀이 방법 var majorityElement = function(nums) { let map = new Map() let [answer,max] = [0,0] for(i=0 ; i max) { answer = nums[i] max = Math.max(map.get(nums[i]) , max) } } return answer }; map 자료구조에 등장횟수를 담아주고 만약 map에 담긴 nums[i]키의 밸류가 max 변수의 값보다 크다면 max 변수의 값과 answer를 업데이트해주면서 순회를 돌면 한번의 반복으로 요..

javascript

이터러블과 이터레이터를 이해하는 방법

😎이터러블과 이터레이터 이터러블 프로토콜 이터레이터 프로토콜 Symbol.iterator 메서드를 호출하면 이터레이터 프로토콜을 준수한 이터레이터를 반환한다. 이것도 프로퍼티다 보니 일반 객체도 이터러블처럼 동작시키기 위해 Symbol.iterator 를 직접 프로퍼티키로 사용해서 이터러블을 만들어줄수도있다. 이터러블의 Symbol.iterator 메서드를 호출하면 이터레이터 프로토콜을 준수한 이터레이터를 반환한다고 했다 이터레이터는 다음과 같은 특징을 갖는다. for of문을 사용할 수 있다. next() 메서드를 가지고 있다. next()메서드는 호출하면 이터러블을 순회하면서 value와 done 프로퍼티를 가지고있는 이터레이터 리절트 객체를 반환해준다. 이 규약을 이터레이터 프로토콜이라고 하고 이터..

javascript

너무 재미있는 예제로 알아보는 실행컨텍스트

function hello () { hi = 0 console.log(hi) } hello() // 0 console.log(hi) //0 function hello () { hi = 0 console.log(hi) } console.log(hi) // ReferenceError: hi is not defined hello() 😎먼저 function execute context에서 var,let,const등의 키워드를 사용하지 않고 냅다 값을 할당해주는 경우 값을 할당받은 무언가는.. Glboal스코프를 가집니다. 즉 함수 스코프마저 초월한 무언가가 되어 전역 변수로 동작하게된다는 뜻입니다. 그것을 알고 다시 위 예제를 보겠습니다. 어째서 호출한 다음에 전역에서 console.log()를 찍어보면 정상적..

programmers

[Programmers Level 1] 바탕화면 정리 Javascript

⚡문제정보 지금 기준 최신으로 나온 문제 중 하나입니다. 문제가 정말...더럽게 길지만. 여러분들의 시간을 위해 문제를 요약하자면 이렇습니다. 한번의 드래그로 모든 파일을 버리고 싶다. 근데 최소한의 드래그로 버릴 방법을 찾아줘라 반환은 [y,x , y ,x] 좌표 형식으로 반환해라. 입출력을 보면 직관적입니다. 그냥 .은 비어있는걸 뜻하고 #은 파일이 있는걸 뜻합니다. 그리고 반환은 [y축에서 가장 작은값, x축에서 가장 작은값, y축에서 가장 큰값 +1 , x축에서 가장 큰값 +1] 을 반환하면된다... 문제가 너무 어지럽게 길어서 문제를 파악하고 여기까지 생각이 도달하는 것이 어렵지 구현 자체는 쉬워서 1레벨이 아닌가... 생각해봅니다. 🔍접근방법 1레벨이니까 브루트포스해도 되겠지 뭐기도했지만 x,..

cheetsheet

reset.css 인풋,버튼 태그의 배경 바꾸기와 placeholder 글자 색 바꾸기

😎 HTML과 CSS를 다룰때.. 가장 짜증나는 부분은 reset.css를 적용시켜둬도 인풋, 버튼의 배경이나 placeholder는 color값을 변경해도 적용이 안된다는 것입니다. 해결방법은 의외로...간단해요 😎인풋,버튼 배경색 없애기 border: none; background: transparent; 이런식으로..설정해주면 됩니다. 😎간단한 reset.css * { box-sizing: border-box; margin: 0; padding: 0; text-decoration: none; list-style: none; color: white; } ! 😎textarea 크기 조정 막아주기 textarea { resize: none; } resize 속성을 건드려주면 깔끔하게 해결됩니다. 😎pla..

TIL

javascript koans

😎대충 다했다. 어떻게 동작할지에 관해 묻는 문제들이 잔뜩 있는데 가독성이... 심히 안좋다. 대체로 잘 알고 있는 개념들이라 쉽게 풀 수는 있는데 잘 사용할 일이 없던 rest 부분에서 좀 많이 막혔던 것 같다. 😎rest 파라미터는... function foo(...rest) { console.log(Array.isArray(rest)); // true console.log(rest); // [ 1, 2, 3, 4, 5 ] } foo(1, 2, 3, 4, 5); 매개변수에 쓰는 스프레드 연산자 같은 느낌인데... 모던 자바스크립트 웹을 참고해보면 Rest 파라미터(Rest Parameter, 나머지 매개변수)는 매개변수 이름 앞에 세개의 점 ... 을 붙여서 정의한 매개변수를 의미한다. Rest 파라..

javascript

getter,setter까지 복사하는 deep copy를 구현하자

😎Shallow copy, Deep copy라고도한다. 쉽게 설명하면 얕은 복사는 depth 1까지만 복사를 수행해주는 것 깊은 복사는 depth 2이상도 잘 복사해주는 것입니다. 얕은 복사는 쉽게 수행할 수 있지만. 깊은 복사는 꽤 많은 에러핸들링을 곁들인 재귀코드를 작성해야 정상적으로 수행할 수 있습니다. 물론 그런 귀찮은 점 때문에 lodash , immer 등 깊은 복사를 도와주는 수많은 라이브러리가 존재합니다. 하지만 이번에는 어떤 방식으로 deep copy가 되는지 한번 코드로 작성해보는 시간을 가지겠습니다. 😎얕은 복사하기 아주 간단합니다. 얕은 복사는 매우 자주 사용하게되고.. 우리도 쉽게 접근할 수 있습니다. 객체에는 Object.assign() 배열에는 slice(),map(),filt..

냠냠맨
'분류 전체보기' 카테고리의 글 목록 (32 Page)