function(4)
-
[Array - VanillaJS] 배열 만들어보기
class myArray { constructor() { this.length = 0; this.data = {}; } get(index) { return this.data[index] } push(item) { this.data[this.length] = item; this.length++; } pop() { const data = this.data[this.length-1]; delete this.data[this.length-1]; this.length--; return data; } delete(index) { const item = this.data[index]; this.shiftItems(index); } shiftItems(index) { for (let i=index; i
2020.05.21 -
[Array Functions] forEach의 상향버전 : map, filter, reduce, find, findIndex
배열은 자료형이 같은 원소들이 차례대로 번호표를 부여받아 저장되어 있기 때문에, 내부를 탐색하여 가공하는 과정에서는 반복문이 활용되기 마련이다. JavaScript에서는 이러한 배열을 쉽게 요리할 수 있도록 다양한 레시피가 준비되어 있다. 예제를 통해 확인해보자. 아래와 같이 numbers라는 배열이 하나 있다. const numbers = [37, 96, 41, 9, 15, 26, 1, 72]; 1. 100씩 곱하는 가장 원시적인 방법 => for Loop for ( let i = 0; i forEach const newNumbers = ..
2020.05.20 -
[Map Function] 배열의 원소마다 함수를 각각 실행시켜주자
React는 한 페이지를 구성하는 요소들을 잘게 쪼개어 모듈화하기 때문에, 레고처럼 조립과 분해로 유지보수가 쉬운 장점이 있다. 그렇기 때문에, 나의 웹사이트에서 "자주" 쓰이는 디자인을 .jsx로 한데 모아 정의해놓고, props를 이용하여 그때그때 표시되는 정보만 갈아끼우면 정말 최고의 효율성을 가져다준다. 여기서 "자주" 쓴다는 것은, CSS의 .클래스마냥 를 여기저기서 끌어다쓸 수 있다는 것인데, 한번 생각해보자. 우리가 항상 접하는 웹페이지는 게시판 목록이나 피드를 보면 알 수 있듯이, 틀은 다 똑같고 안에 내용만 바뀌는 형태가 압도적으로 많다. 그렇다면 각 글이나 사진이 같은 형태로 무수히 반복된다는 뜻이다. 이 많은 태그들을 일일이 수작업하지 않고, 그 전체 수만큼 알아서 반복문 돌려주는 것..
2020.05.19 -
[http] Callback
콜백함수란 어떤 함수 자체가 하나의 값으로서 상위 함수의 인자가 되는 것이다. 여기서 상위 함수를 고차함수라고 하며, 고차함수가 먼저 실행된 뒤에 그 안에 있는 콜백함수가 실행된다. http 통신에서 콜백함수가 많이 쓰이는 이유는, 통신분야 특성상 여러 대의 컴퓨터가 정보를 서로 주고받는 과정에서는 시간이 소요되고 에러의 위험이 있기 때문에, 짜여진 코드처럼 순서대로 착착 맞아떨어질 수가 없다. 만약 그냥 초보적인 수준으로 function(){}만을 사용한다면 통신을 담당하는 코드가 서버에서 자료를 온전히 불러오기도 전에 다음 코드로 진행하기 때문에 나의 웹서비스는 에러만을 출력할 것이다. 하지만 콜백을 사용하면 일반적으로 화면을 렌더링하는 등 즉각 필요한 코드들은 Stack에서 모두 실행시키고 빼버린 ..
2020.05.18