분류 전체보기
-
Javascript: MathSTUDY/Vanilla JS 2022. 3. 5. 19:30
[ Math 란? ] 표준 Built-in 객체로 수학적인 연산을 위한 속성값과 메서드를 제공하는 객체이다. Math는 생성자 함수가 아니며, 모든 속성과 메서드는 정적이기에 Math.function()으로 언제든지 호출 가능하다. Math.E: 오일러 상수 Math.PI: PI(파이) 값 Math.abs(x): 절대값 // -Infinity의 경우 Infinity로 반환됨 Math.max(x): 최대값 Math.min(x): 최소값 Math.random(): 랜덤 난수 값 Math.pow(x,y): 제곱 Math.sqrt(x): 제곱근 Math.round(x): 소수점 처리 - 반올림, 반내림 결과 Math.ceil(x): 소수점 처리 - 반올림 결과 Math.floor(x): 소수점 처림 - 반내림 ..
-
Javascript: SetSTUDY/Vanilla JS 2022. 3. 5. 19:02
Javascript에서 제공하는 Collection에는 크게 Index로 수집되는 Indexed Collection / Key로 수집되는 Keyed Collection이 있다. Indexed Collection 종류: Array, Typed Array Keyed Collection 종류: Object, Map, Weak Map, Set, Weak Set [ Set 이란? ] Value만을 저장하며 중복을 허용하지 않는 Collection이다. 이러한 특징 덕에 중복된 데이터를 제거할 때 많이 사용된다고 한다. 생성자: new Set() 개수 확인: Set.size 요소 추가: Set.add(value) 요소 삭제: Set.delete(value) // 삭제되면 return true, 삭제되지 않으면 re..
-
Javascript: MapSTUDY/Vanilla JS 2022. 3. 5. 17:47
Javascript에서 제공하는 Collection에는 크게 Index로 수집되는 Indexed Collection / Key로 수집되는 Keyed Collection이 있다. Indexed Collection 종류: Array, Typed Array Keyed Collection 종류: Object, Map, Weak Map, Set, Weak Set [ Map 이란? ] 다양한 자료형의 Key를 허용하고, Key-value 형태의 자료형을 저장할 수 있는 Collection이다. Map은 Object보다 더 다양한 Key의 사용을 허용하고, 값의 추가/삭제 시 메서드를 통해 수행이 필요하다. 생성자: new Map() 개수 확인: Map.size 요소 추가: Map.set(key, value) //r..
-
HTML: 태그의 중요성, 스크린 리더STUDY/HTML&CSS 2022. 3. 3. 17:15
HTML 태그가 개발자의 가독성, 그리고 SEO를 위해 중요하다고만 생각했는데 앞이 보이지 않는 분들을 위한 "스크린 리더" 프로그램에 HTML태그가 정말 정말 정말 중요하다는 사실을 배웠다. 태그와 태그는 같아 보이지만 스크린 리더에서 읽는 방식이 다르다고 한다. 물론 이 외에도 많은 태그들이 있다. 누군가 언급하지 않았다면 절대 인지하지 못했을 영역이라 큰 충격을 먹었기 때문에 이 글을 작성하고 있다. 평소 키오스크처럼 비장애인(그리고 기계에 친숙한 사람들)만 사용하기 편한 기기에 대해 종종 고찰해보았는데, 정작 웹의 접근성 부분에서 내가 이런 생각조차 하지 못했다는 사실에 적절히 놀라기도 했다. 우연히 보게 된 강의에서, 덕분에 크게 반성하는 시간을 가지게 되었다. IT가 일상의 큰 부분을 차지하게..
-
개발 일기 : Kakao Map API로 맛집 지도 만들기[1]STUDY/개발 일기 2022. 3. 1. 22:22
매번 클론 코딩을 하다, 오랜만에 개인 토이 프로젝트로 Kakao Map API를 건드려보기로 했다. Kakao Map API를 쓰는 법은 여타 API와 유사했다. 1) Kakao Developer에 가입하고 2) Application을 새로 만들고 3) 내 도메인 정보를 입력해준 다음 4) API Key값을 받아오면 끝! [ API 사용에 주의해야 할 점! ] kakao map API는 async / defer 처리가 안 된다는 것! 이걸 모르고 defer 처리를 했다가 빈 화면을 봤다. 또, 본인이 작성하는 map script는 무조건 다운받는 API 하단에 존재해야 한다고 한다! 예제를 따라 출력했더니 무사히 화면에 뜨는 것을 확인할 수 있었다. Github pages에 올린 웹 페이지 역시 무사히..
-
Javascript: Array[3] - Array 함수 사용 연습STUDY/Vanilla JS 2022. 2. 27. 19:00
[ Array를 String으로 변환 ] Array를 String으로 변환하는 함수는 2가지가 있다. - toString() - join(separator?: string) 둘 다 Return 값으로 String을 반환한다. 여기서 큰 차이점이라면, toString()은 무조건 ' , ' (콤마)로 배열의 값을 구분해준다는 것이고, join()은 내가 적어주는 구분자로 배열의 값을 구분해준다는 것이다. 만약 join()에 아무것도 입력하지 않는다면 자동으로 ' , '(콤마)로 구분해준다. 이때 결괏값은 toString()과 같다. [ String을 Array로 변환 ] Array를 String으로 변환하는 함수는 2가지가 있다. - from() - split(separator: string | RegEx..
-
Javascript: Array[2] - 기본 Array 함수STUDY/Vanilla JS 2022. 2. 26. 21:45
* 참고용으로 정리하는 게 주목적이라 그리 자세하게 적혀있지 않습니다. [ 배열 넣고 빼기 ] - arr.push() : 배열 가장 끝에 값 새로 넣기 arr.push( 1, 2, 3 ); 이렇게 여러 값을 한꺼번에 넣을 수도 있다. - arr.pop() : 배열 가장 끝의 값 빼기 - arr.unshift() : 배열 가장 앞에 값 새로 넣기 - arr.shift() : 배열 가장 앞의 값 빼기 여기서, 배열은 가장 앞에 값을 집어넣으려면 모든 인덱스를 하나하나 뒤로 이동시키는 과정이 필요하다. 이 때문에 unshift() 와 shift()는 속도가 매우 느린 편이다. [ 지정된 위치의 데이터 삭제 ] - splice(start: number, deleteCount?: number) : splice는 ..