oris9

제너레이터(generator) 함수란, 단어 자체를 번역하면 생성, 발생시키는 것을 의미한다. `function*` 키워드를 사용해 생성할 수 있다. 원하는 부분에서 중간에 멈췄다가, 그 부분에서 다시 재개할 수 있는 함수이다. 가장 큰 소수 찾기, 미로통과하기 같은 수학적 문제에 사용할 수 있으며, 계산을 더 작은 단위로 분할해, 병렬 또는 한번에 실행할 수 있으므로 머신러닝 알고리즘 풀이시 대량의 데이터를 처리하는 상황에서 유용한 것이다. 기본적으로 일반 함수는 하나의 값만을 반환하지만 제너레이터 함수는 호출되면 `제너레이터 객체`라는 이터러블 객체를 생성하며, 여러 개의 값을 필요에 따라 하나씩 `반환(yield)`할 수 있다. 제너레이터 객체 메서드 next() : next()를 호출하면 가장 가..

** 웹 표준은 월드 와이드 웹의 측면을 서술하고 정의하는 공식 표준이나 다른 기술 규격을 가리키는 일반적인 용어이다. 최근에 이 용어는 웹 사이트를 작성하는 데 중요도가 높아지고 있으며 웹 디자인, 개발과 관계가 있다. HTML5 시멘틱 태그 HTML5의 시맨틱(sematic) 태그는 웹 문서의 구조와 의미를 명확하게 나타내는 데 사용된다. 시멘틱 태그는 각요소의 의미를 명확하게 나타내므로, 직관적으로 구조를 이해하기 쉽게 만들고, 유지보수성을 높이는데 도움이 된다. 검색 엔진이 웹 페이지의 콘텐츠를 올바르게 이해해 인덱싱하는데 도움이 되므로, 적절한 검색결과에 노출될 수 있도록 도와주는 검색 엔진 최적화(SEO)에 도움이 된다. 스크린리더와 같은 보조기술을 사용하는 사용자들의 웹페이지 이해와 탐색 편..

정규표현식(RegExp, regular expression)이란 사전적인 의미로는 특정한 규칙을 가진 문자열의 집합을 표현하는데 사용하는 형식 언어라고 한다. 문자열에서 특정 내용을 찾거나 대체 또는 발췌하는데 사용한다. 구현하기가 마냥 쉽지는 않고, 짧게 표현되어 함축된 의미를 가지고 있어 가독성이 좋지 않다는 단점이 있지만, 그러나 사용자의 전화번호 검색, 패스워드 사용 등록과 같은 문자열에서 특정한 조건을 표현해야되는 경우에 일반적인 반복문, 조건문을 사용할 때보다 정규표현식을 사용하여 매우 간단하게 특정 조건들을 표시하고, 빠르고 효율적인 기능 수행을 하도록 만들 수 있다. 정규표현식 작성법 a. 정규 표현식 리터럴 `const re = /ab+c/i;` 다음과 같이 슬래시로 감싸서 `/검색할 ..

개인적으로 css를 작성할 때, 가장 감으로 하는 부분인 것 같다. 제대로 이해하고 쓸 수 있도록 공부하자 😡 position 따로 position을 지정해주지 않으면, 기본적으로 요소들은 `static`으로 지정되어있다. 또한 대부분 position은 요소의 정확한 위치 지정을 위해서 `top`, `left`, `bottom`, `right` 속성과 함께 사용된다는 것을 알아두자. ** position을 absolute나 fixed로 설정시 가로 크기가 100%가 되는 block의 특징이 사라지게 된다. 1. static 요소에 적용되는 기본값이다. 요소가 HTML 문서 흐름에 따라 배치되며, top, right, bottom, left 속성이 적용되지 않는다. 2. relative 요소가 HTML ..

Cascading Style Sheets 의 `Cascading` 이란, 폭포처럼 문서의 위에서 아래로 흐르면서 스타일이 적용되는 css의 방식을 설명하는 것이다. 기본적으로, 스타일이 중복될 때는 가장 아래쪽의 스타일이 적용되게되는 것이다. 이러한 css에는 중요한 두가지 원칙이 있다. 1. 스타일은 상속(Inheritance)된다. 부모 요소에서 정의된 스타일 속성들이 자식 요소에게 상속된다. 기본적으로 자식요소에게 상속되지만, 상속되지 않는 요소들과 속성들이 존재한다. 2. 스타일에는 우선순위(Specificity)가 존재한다. 실제 css 에는 단순한 순서만을 고려해 스타일을 적용하지 않는다. 중요도, 명시도, 코드순서를 통해 우선 순위를 정하고 그 우선 순위에 맞게 스타일을 적용시킨다. `중요도..

유용하지만 맨날 헷갈리는 .. 메서드들 🥹🥹🥹🥹🥹 자주 쓰는 단순한 메서드들만 사용하게 되서 적어놓는다. 계속 추가 예정 reduce() 일반적으로 reduce() 는 배열에서 누적값을 다룰 때 사용한다. arr.reduce(콜백함수, 초기값설정) arr.reduce((acc, cur, idx, src)=>{},초기값설정) // 누산기 (acc) // 현재 값 (cur) // 현재 인덱스 (idx) // 원본 배열 (src) // 리듀서 함수의 반환 값은 누산기에 할당되고, // 누산기는 순회 중 유지되므로 결국 최종 결과는 하나의 값이 됩니다. 주의! 초기값을 넣어주지 않으면 배열의 첫번째 요소를 사용한다. 객체 내의 값 인스턴스 개수 세기 var names = ["Alice", "Bob", "Tiff..

1. 파라미터(parameter), 매개변수 `parmeter` 는 기본적으로 함수를 정의할 때, 사용되는 것으로 function f(x, y) { // 이때, x y가 매개변수가 된다 return x + y; } f(1,2); 이름에서 알 수 있듯이 값이 아닌 `변수`이다. 2. 전달인자, 인자, 인수, argument 제목에서와 같이 `arguments` 는 전달인자, 인자, 인수, argument로 번역될 수 있다. 전달인자라는 것은, 기본적으로 함수를 호출할 때 인자로 집어넣게 되는 값들을 이야기한다. 함수에 넘겨주기위해 끌어오는 `값`이다. 즉, function sum(x, y) { return x + y; } sum(1,2); // 이때 1, 2가 전달인자가 된다. 만약 함수를 정의할 때 받을..

웹 브라우저에서 로그인했는지, 이전에 방문한 페이지가 어딘지, 현재 페이지의 상황 등, 클라이언트 측의 데이터를 저장해야할 필요가 있을 수 있다. 이때 웹의 저장소를 이용해서 다양한 방법으로 클라이언트의 데이터를 저장할 수 있다. 관련 글 : 쿠키, 세션, 캐시에 대해 알아보기 웹스토리지(web storage) HTML5부터 도입된 개념으로, (** 도입 이전에는 쿠키를 저장소의 역할로 사용했다.) 데이터를 클라이언트 측에서 저장하고 서버와는 통신하지 않는다는 특징이 있다. 따라서 불필요하게 서버에 데이터를 저장하지 않아도 되고, 브라우저에서만 접근 가능하고 서버에서 접근은 불가능하다. `key - value`형태로 데이터를 저장하고, 저장용량은 모바일은 2.5Mb, 데스크탑은 5Mb~10Mb 정도이다...