본문 바로가기
반응형

programming language/Javascript10

string 데이터 배열로 만들기 공통 컴포넌트에서 출력되는 형식에 맞게 데이터를 가공후에 props를 통해 데이터를 내려보내려고 한다. - 서버에서 받아오는 데이터 형식 "testDescription": "-테스트 리스트 입니다 1번째.-테스트 리스트 입니다 2번째.-테스트 리스트 입니다 3번째.", - 만들어져야 하는 형식 newList: [ { "conText": "-테스트 리스트 입니다 1번째." }, { "conText": "-테스트 리스트 입니다 2번째." }, { "conText": "-테스트 리스트 입니다 3번째." }, ] 처음 시도했던 방식 '-' 기호를 가지고 하나의 문자열로 오는 데이터를 리스트로 나눈 후 conText의 이름에 데이터를 넣은 객체 모습으로 리턴시켰다. 그리고 나서 빈 문자열이 있을 경우는 지워주는 .. 2023. 12. 17.
vanillaJS 페이지네이션 구현 각 구현되는 조건에 따라 파마리터명은 다르겠지만 초기 설정값을 정한다. 보통 화면 구현에는 이런 형식을 많이 사용하는 편인거 같다. 각 회사마다 다른 이름을 사용하고 있으니 참고! pageNum: 현재 페이지 pageSize: 한 페이지 당 나타낼 데이터의 갯수 totalRow: 총 데이터의 갯수 pageCount: 페이지 리스트 갯수 1. 먼저 페이징할 수 있는 데이터를 만들기 대략적으로 데이터가 담긴 리스트를 먼저 만들어 본다. 혹은 json-server등 유용한 API를 사용해도 무관하다. const someList = []; for (let i = 1; i { /** * 어디서 부터 어디까지 출력 시킬것인지 * slice : index를 이용해서 자름 (endIndex앞에자름) */ const s.. 2023. 12. 17.
prototype 프로토타입은 자바스크립트의 핵심이다. 프로토타입 기반의 언어가 자바스크립트라는 개념을 인식해야한다. 클래스를 사용할 때도 프로토타입과 연관되어 있다. const user = { name: 'cap', age: 100 } const admin = user = { name: 'cap', age: 100, role: 'admin' } user과 admin 객체를 만들었다. 코드에서 보면 중복되는 name, age 속성들이 있다. 중복되는 코드를 줄일 수 있는 방법이 javascript에서 지향하는 prototype상속의 개념이다. user의 정보를 admin도 사용할 수 있도록 __proto__를 사용해서 prototype을 상속시켜줬다. admin을 조회해보니 [[prototype]] 안에는 age와 nam.. 2022. 12. 8.
call, apply, bind call, apply, bind 함수 호출 방식과 상관없이 this를 지정할 수 있다. call `func.call(thisArg[, arg1[, arg2[, ...]]])` 모든 함수에서 사용할 수 있고 this를 특정값으로 지정할 수 있다. - thisArg: 함수를 호출할 때 사용되어지는 this - arg1, arg2... : 함수가 호출되어야 하는 인수를 말한다. 쉽게 얘기하자면 this는 첫 번째 , 나머지 두 번째 부터는 해당 함수의 매개변수로서의 사용 [call을 사용해서 this 지정하기] //함수에서 this는 window를 가리킨다. const mike = { name: 'mike' } const Tom = { name: 'Tom' } function showTishName() { c.. 2022. 12. 6.
728x90
반응형