
1. 자바스크립트가 에러를 던지는 방법 (이번 단원은 Error 객체가 생성되고 상속되는 과정을 설명한 부연설명이므로 NativeError의 종류만 보고싶다면 지나쳐도 된다) 자바스크립트 에러가 감지하면 Error 생성자 함수를 통해 인스턴스를 생성하고 이를 throw, 즉 던진다. 또한 프로토타입 체인을 통해 NativeError, AggregateError 등 더 세부적인 에러 인스턴스들을 생성하여 던질 수 있다. (참고 : 20.5 Error Objects) 1-1. 에러를 생성하는 빌트인 객체 Error Error Contructor 전역 객체의 Error 프로퍼티의 초기값 [[Prototype]] 값으로 %Function.prototype%를 가짐 하위 클래스로 확장 가능 하위 클래스는 반드시 ..

객체의 구조 타입을 구분하기 프로토타입 체인 및 객체의 생성 과정에 대한 이해를 위한 심화 예제입니다. 이 포스팅에서 제시한 두 가지 솔루션은 각각 한계점이 있어 실무에서 사용하기 적합하지 않습니다. 실제로 객체의 구조 타입을 구분하실 땐 타입스크립트 등의 라이브러리를 이용하십시오. 시도1 : typeof typeof 연산자를 통해 자료형을 비교해주자 ! ⇒ 실패 typeof 연산자는 피연산자의 평가 전 자료형을 나타내는 문자열을 반환합니다. (MDN) 실패 자바스크립트의 객체들은 모두 object 자료형이다. 자바스크립트의 데이터 타입은 7가지의 원시타입(number, string, boolean, undefined, null, symbol)과 1개의 객체 타입(object)으로 나뉜다. 다시 말해 원..

티스토리 플러그인으로 코드블럭 커스텀 비루한 코드블럭을 코드블럭답게 보여주려면 예전엔 Highlight.js 같은 라이브러리를 직접 코드로 커스텀해야했다. 그런데 언제부터인지 (혹은 내가 오랫동안 모른채 살아왔는지...) 티스토리 플러그인으로 바로! 간단하게 적용시킬 수 있었다. 블로그 관리자 페이지로 가서 플러그인으로 가보면 클릭 한번으로 바로 적용시킬 수 있다. 이미지에 보이는 Syntax Highlight를 적용시키면 된다. 마무리 티스토리 짱짱맨! (TOC도 플러그인으로 들어온다면 비개발자 유저들이 참 좋아할 것 같은데용)
TOC 만들기 프스팅 목적 글을 읽을 때 화면에 고정된 목차 링크 TOC를 만들어보자 TOC는 h1,h2 와 같은 헤더를 읽어 목차를 만든다. 따라서 글을 작성할 때 마크다운 모드로 작성하여야 한다. Tocbot을 이용해 티스토리의 스킨에 삽입하는 것 자체에 목적이 있다. 더 좋은 코드, 적절한 커스텀에 대한 포스팅은 후에 작성될 예정이다. TOC가 필요해 벨로그로 가고싶은 가장 큰 이유 중 하나가 글 내부에 고정되어 바로 이동할 수도 있는 목차였다. 티스토리도 언젠가 기능을 추가해주길 기다리면서.. Tocbot이라는 플러그인을 적용시켰다. jquery 없이 순수 바닐라 자바스크립트로 구성된 모듈이다. toc 이란 Table Of Contents 의 약자로, 마크다운으로 작성한 글의 헤더 태그들을 모아 ..

동적 타이핑이 가지는 코드 구현의 유연성은 javascript의 특장점 중 하나라고 볼 수 있다. 따라서 이를 사용하지 말자는 것이 아니다. 단, 이에 관한 최적화 관점을 인지하고 불필요한 동적 타이핑 남발을 자제하고 성능을 더 끌어올리자는데 이번 포스트의 의미가 있다. 🚩 사전 정보 객체 메모리 저장 : 메모리 오프셋 0⬛⬛ 1⬜⬜⬜2⬛⬛⬛ C++ 등의 언어에서는 객페의 프로퍼티에 접근할 때 구조체의 기준 메모리 주소부터 상대적인 값인 오프셋이 있다. 각각의 오프셋마다 차지하는 공간은 들어올 데이터 타입(숫자형은 8byte 등)을 통해 결정한다. 정적 타이핑 언어(C++, Java ...) 컴파일 이전에 객체 레이아웃이 고정되기 때문에 이때 고정된 오프셋으로 프로퍼티에 바로 접근 가능하다. Javasc..
웹 접근성 Web Accessibility Thw power of the Web is in its university, access by everyone regardless of diability is an essential aspect. - Tim Berners 중요하지만 실무에서 많이 무시되는 영역이다. '내'가 직접적으로 사용하지 않고, 해당 고려사항이 수익과 직결하지 않기 때문이다. 하지만 좋은 개발자란 항상 사용자의 관점을 생각하고, 그들의 편안함을 위해 조금의 수고를 더 하는 것이다. 다양한 사용자 경험, 그에 대한 개발자의 당연한 고려 시각 장애, 청각 장애, 지체 장애, 뇌병변 장애 등 다양한 카테고리의 장애가 있다. 그들이 정보를 접하는 방법을 생각하여 접근성이 좋은 개발을 생각하자. 사..

💚Emmet 01.구조와 내용 한번에 만들기 .container>header.header+div.visual+main.main+article.slogan+footer.footer header.header{헤더내용} 02.리스트 안의 메뉴 항목들로 a 태그 감싸기 태그로 감쌀 부분 블럭설정 ctrl + shift + p 팔렛트 열고 Emmet : Wrap with Abbriviation Emmet 명령어 쳐주기 ol>li*>a[href="#"] 완성! 03.넘버링 자동으로 달아주는 Emmet $를 이용한다. [예시] numbering1 ~ 3 까지 div 3개 만들기 .numbering$*3 04. Emmet 유용한 단축키 설정하기 Evaluate Math Expression : 계산 자동으로 하게 해주는..
let sHash = new Map(); 맵(Map) 기본 개념 👉 맵(Map)이란? key : value 의 구조로 저장되어 key를 통해 바로 value에 접근할 수 있고, 저장된 순서대로 각 요소들을 접근할 수도 있다. (즉, 인덱스가 아닌 key로 바로 값을 찾고, for of 같은 반복문도 돌릴 수 있다.) 주의 사항 'key는 중복될 수 없다'. Object와의 주요한 차이점은 다음과 같다. map key는 반드시 구체적인 value가 있을 때만 들어갈 수 있다. key값으로 무엇이든 올 수 있다. (함수, 오브젝트 ...) 전체 사이즈(key의 갯수)를 size() 함수를 통해 간단하게 알 수 있다. 순서대로 key, value, entries 를 호출하기 쉽다. (iterable) obje..
- Total
- Today
- Yesterday
- JavaScript
- 개발일기
- 네카라쿠배
- hiddenclass
- 넥사크로
- FE
- 티스토리
- JS
- tocbot
- 프로토타입체인
- 프론트엔드
- MDI
- 티스토리커스텀
- 일반객체구분
- 패스트캠퍼스
- html
- 히든클래스
- 알고리즘
- 네카라쿠배시즌2
- til
- SDI
- 프레임구조
- nexacro
- 자바스크립트
- css
- This_weekILearned
- 네카라구배
- getPrototypeOf
- 웹접근성
- rangeerror
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |