본문 바로가기

728x90

기타/javascript

(10)
[Javascript]split() 함수 문자열 배열로 변환 문자열을 구분자를 기준으로 잘라서 배열로 저장하는 방법에 대해 알아보도록 하겠습니다. split함수를 사용하여 할 수 있습니다. string.split(구분자, 최대 분할 개수) 인자는 위와 같이 두 개입니다. 구분자, 최대 분할 개수입니다. 모두 필수는 아닙니다. 1. 파라미터에 아무것도 넣지 않았을 때. let s = 'a b c,d,e' s.split() ["a b c,d,e"] 문자열을 그대로 배열에 담습니다. 2. 구분자에 '' 넣기. s.split('') (9) ["a", " ", "b", " ", "c", ",", "d", ",", "e"] 모든 요소를 배열에 따로 분리해서 담습니다. 3. ' ' 넣기. s.split(' ') (3) ["a", "b", "c,d,e"] 이렇듯 띄어쓰기를 기준..
자바스크립트 async-await 오늘은 자바스크립트 async-await에 대해 알아보도록 하겠습니다. 1. 자바스크립트 async 함수 async 함수는 비동기 함수로 이벤트 루프를 통해 작동합니다. promise를 사용하여 결과를 반환합니다. 비동기에 대해 이해가 안 가는 분들을 위해 설명을 해드리면 비동기는 쉽게 말해 프로그램의 진행이 병렬로 갈라지는 것입니다. 동기는 순서대로 하나하나 진행되지만 비동기는 중간에 2개 혹은 그이 상의 길로 갈라질 수 있습니다. 문법은 간단합니다. function에 앞에 async가 붙으면 됩니다. async function asyncf() { } 2. 자바스크립트 async await 자바스크립트의 비동기 처리 패턴 중 하나로 콜백 함수와 프로미스의 단점을 보완하여 개발자가 읽기 좋은 코드를 작성..
자바스크립트 foreach 메서드 사용법 foreach()는 배열에 적용되는 함수로 배열 각 요소에 callback함수를 적용할 수 있도록 하는 메서드입니다. 간단한 예제를 통해 봅시다. var array=[1,2,3] array.forEach(x=>{ console.log(x) }) 1 2 3 array 배열에 foreach를 사용하면 각요소를 x에 넣고 함수를 실행시킵니다. 1,2,3이 순서대로 출력됩니다. 1.for문보다 훨씬 간단합니다. for(let i=0;i{ console.log(x,i,t)}) 1 0 (3) [1, 2, 3] 2 1 (3) [1, 2, 3] 3 2 (3) [1, 2, 3] x는 요소값, i는 인덱스값, t는 전체 배열입니다. 필요한 것을 적절하게 가져다 쓸 수 있습니다.
자바스크립트 날짜(Date) 객체 시간 설정하는 법 오늘은 자바스크립트의 Date객체에 대해 알아보도록 하겠습니다. Date 객체는 1970년 1월 1일부터 국제 표준시를 유닉스 타임스탬프를 사용해 나타냅니다. 다른 자바스크립트 객체와 같이 new를 통해 생성할 수 있습니다. 간단한 예시를 통해 알아보도록 하겠습니다. 1. 자바스크립트 날짜 객체 생성 및 값 가져오기. let now =new Date(); now Tue Jan 26 2021 12:27:15 GMT+0900 (대한민국 표준시) 단위별로 값을 가져올 수도 있습니다. now.getDate() 26 now.getFullYear() 2021 now.getMonth() 0 get함수 사용해 위와 같이 가져올 수 있습니다. 년, 월, 일뿐 만아니라 시간, 분, 초까지 가져올 수 있습니다. 주의할 점은..
javascript map 객체 선언 방법과 object 객체와의 차이점 map 객체는 키-값 쌍을 삽입 순서대로 기억하는 객체입니다. 1.javascript map 객체 만들기. let map = new Map(); map.set('a',1) map.set('b',2) map.set('c',3) new Map()을 통해 객체를 만들고 set을 통해 만들 수 있습니다. 2.map과 object 객체의 차이점. 차이점이 보이시나요? map의 객체들마다 인덱스가 있고 {}으로 쌓여 있습니다. 반면 object는 key값이 인덱스가 되고 value가 값이 됩니다.
자바 스크립트 프레임 워크 종류 및 순위 Top5 오늘은 자바 스크립트의 프레임워크 순위 top5를 간단하게 알아보도록 하겠습니다. 1.vue js. vuejs는 프론트엔트 프로그레시브 프레임워크입니다. 다른 것들과 달리 선택적으로 채택해 사용할 수 있습니다. 때문에 다른 라이브러리나 기존 프로젝트에 적용하는 것이 쉽습니다. 또한 고성능의 싱글 페이지 애플리케이션 구축이 가능합니다. 핵심 기능은 데이터 렌더링, 컴포넌트입니다. 간단한 템플릿문구로 DOM에서 데이터를 선언적으로 렌더링하는 기능을 제공합니다. 재사용이 가능한 컴포넌트를 만들 수 있어 효율적인 시스템 구성이 가능합니다. 이밖에 조건문, 반복문, 사용자 입력 핸들링 등의 기능이 있습니다. vuex라는 강력한 라이브러리가 있습니다. vuex를 사용하면 데이터를 단방향으로, 중앙집중적으로 관리할 ..
자바스크립트 문자열 메소드 초간단 정리 오늘은 자바스크립트의 문자열 메소드를 살펴보도록 하겠습니다. 1. 자바스크립트 문자열 선언 및 초기화 var a = 'balmostory' 2. 문자열 자르기. split와, substring이 있습니다. split은 요소로 자르는 것이고 substring은 인덱스로 자릅니다. a.split('m') (2) ["bal", "ostory"] a.substring(1,5) "almo" 3.자바스크립트 문자열 찾기. indexof함수를 사용해 찾고자하는 문자의 인덱스를 찾을 수 있습니다. a.indexOf('a') 1 a.indexOf('x') -1 없는 문자열을 찾으면 -1을 반환합니다. 4.문자열 길이. lengt를 통해 길이를 파악할 수 있습니다. a.length 10 5. 문자열 제거 replace, ..
자바스크립트 object 객체 key, value 접근 등 사용법 정리 자바스크립트 object는 key와 value로 이루어진 데이터 타입입니다. 메서드를 살펴보도록 하겠습니다. 1.object 객체 만들기. var a = { name : 'balmostory', age : 25, gender : 'male' } 2. 객체 value에 접근하기. a.age 25 a.name "balmostory" a.gender "male" //한 번에 value array로 받기. Object.values(a) (3) ["balmostory", 25, "male"] 3.key값에 접근하기. Object.keys(a) (3) ["name", "age", "gender"] 4. 객체에 추가하기. a['job']='개발자' a {name: "balmostory", age: 25, gender..

728x90