개발 관련 지식/JS9 Virtual scroll ( 분석하기 위해 남김 ) 데이터가 많아도 실제 DOM에 있는 row(데이터)는 적어서 slide 시 버벅거리지 않는다. 2020. 3. 28. callback function - JS 콜백함수란 함수 안에서 특정한 시점에 호출되는 함수를 뜻한다. 그래서 함수의 매개변수로 함수가 들어가고, 매개변수로 들어간 함수가 콜백함수라고 불린다. 아주 중요한 개념이라고 생각하는데, 그 이유는 비동기 처리의 문제점을 해결하기 위해서이다. 비동기 처리란 어떤 함수가 끝날 때까지 기다렸다가 다음 함수를 실행하는 것이 아니라, 함수가 실행되는 도중에 또 다른 함수를 호출해서 여러 동작을 동시에 할 수 있도록 처리하는 자바스크립트의 특징이다. 하나의 함수가 복잡해서 처리 속도가 느리다면, 다른 함수들의 실행이 지연되기 때문에 사이트의 동작이 멈추게 된다. 그런 것을 방지하기 위해 비동기 처리를 하는 것은 중요하다. 그런데 대표적인 문제점으로, 서버와 통신을 할 때 비동기 처리를 하면 response를 받기.. 2020. 3. 9. map 함수 배열의 모든 요소를 함수에 적용하여 나온 결과를 모아 새로운 배열을 생성해내는 함수 filter 함수와의 차이점은. filter 함수는 요소를 콜백함수에 적용해 결과가 true인 것들을 반환해 새로운 배열로 만들어내는 함수이다. 틈틈이 꾸준하게 - filter 함수 filter 함수 배열이나 JSON 객체에 대해 콜백함수의 조건에 해당하는 모든 요소가 있는 배열을 새로 생성하는 기능. arr.filter(callbackFunction(element [, index [, array] ] ) [, thisArg] ) filter함수는 콜백함수와, thi.. im-recording-of-sw-studies.tistory.com 기본적으로 배열의 요소만큼 반복한다고 생각하면 된다. arr.map(callback.. 2020. 3. 8. eslint ECMAScript + Lint 이다. JS는 ECMAScript 사양을 준수하는 범용 스크립팅 언어이고, Lint는 소스 코드를 분석하여 프로그램 오류, 버그, 스타일 오류를 검사하는 작업이고, Linter는 이런 작업들을 도와주는 도구들을 의미한다. 즉, JS 소스코드가 자신이 설정한 코드스타일대로 작성됐는지, 에러는 없는지 검사해서 일관된 코드스타일로 작성하도록 도와주는 도구이다. JSLint, JSHint와 같이 또 다른 JavaScript 정적 분석 도구들도 있고 예전에는 이런 도구들이 많이 사용되었으나, ESLint가 커스터마이징이 쉽고 확장성이 뛰어나서 요즘에는 ESLint가 많이 쓰이고 있다. npm을 통해서 설치하기 위해 node.js를 먼저 설치 하자. ESLint를 설치하고 기본 설정.. 2020. 3. 7. babel 유용한 기능을 갖고 있다. 개발 환경에 구애받지 않고 자바스크립트의 최신버전 문법으로 개발할 수 있도록 도와주는 도구이다. JS 문법의 발전 속도는 빠른데, JS 코드의 실행 환경이 그 속도를 따라오지 못하는 경우가 많다. 그래서 ES6 이상의 문법으로 개발을 하자니 실행되지 않는 환경이 있고, 그렇다고 모든 환경에서 실행되도록 하자니 ES5 이하의 문법으로 코드를 작성해야한다. 이런 점을 해결하기 위한 도구가 Babel 이다. Babel은 JS transpiler 인데 편하게 JS compiler 라고도 부른다. compile은 인간의 소스 코드를 컴퓨터가 이해할 수 있도록 바꾸는게 컴파일이고, transpile은 환경이 달라져도 실행될 수 있도록 같은 언어에서 소스 코드 문법만 바꾸는 과정을 뜻한다... 2020. 3. 6. split : 문자열 분할 함수 split은 특정 문자열을 제거하고 남은 문자열을 배열로 반환한다. split의 기본형태 str.split(separator, limit) separator는 str을 끊어야하는 부분을 나타내는 문자열 limit은 끊어진 문자열의 최대 개수를 나타내는 정수. separator와 limit 둘다 선택적으로 사용 가능하다. 다만 limit은 separator가 있을 때만 사용이 가능하다. 또한 separator는 정규표현식을 넣을 수 있다. separator에 아무것도 입력하지 않았을 경우 원래의 문자열이 배열에 담겨서 나온다. const str = 'abcdefg'; const splitedStr = str.split(); console.log(splitedStr); // ["abcdefg"] separa.. 2020. 3. 5. 이전 1 2 다음
