TIL

2020-11-05

오늘 하루도 끝이났다. 허무하다. 오피스아워듣다가 끝이난것같다.. 새롭게 듣고 알게된 것이 너무 많아서, 일단 단어별로 아주 초간단하게 정리해보자. 다양한 CSS selector도 한번 훑어보자. 아무리생각해도, this와 closure, spreadsyntax는 파야할것같다..히히

closure : 함수와 함수가 선언된 어휘적 환경의 조합(MDN에서의 closure정의)
git : VCS 버전관리
git repositioy: 코드저장소
namespace: 이름의 공간, 변수의 이름이 적혀있는 공간.
유사배열 : []로 감싸져있지만 배열이 아닌 것들. 배열과 꼭 구분해주어야하는데 (구분법:Array.isArray 사용하기), 유사배열을 배열이 아니기 때문에 method를 사용할 수 없기 때문이다. 배열method를 사용하기 위해서는 call,apply를 쓰거나 최근 업데이트 된 array.from을 사용하면 된다.
local : 내가 쓰고 있는 컴퓨터, 내 손에 닿는 저장소

CSS Selector

• h1 { }
  div { }
  전체 셀렉터

• *{ }
  Tag 셀렉터

• section, h1 { }
  ID 셀렉터

• #only { }
  class 셀렉터

• .widget { }
  .center { }
  attribute 셀렉터 (외울 필요는 없습니다)

• a[href] { }
  p[id="only"] { }
  p[class~="out"] { }
  p[class|="out"] { }
  section[id^="sect"] { }
  div[class$="2"] { }
  div[class*="w"] { }
  후손 셀렉터

• header h1 {}
  자식 셀렉터 (후손 셀렉터와의 차이를 반드시 알고 있어야 합니다)

• header > p { }
  인접 형제 셀렉터

• section + p { }
  형제 셀렉터

• section ~ p { }
  가상 클래스

• a:link { }
  a:visited { }
  a:hover { }
  a:active { }
  a:focus { }
  요소 상태 셀렉터

• input:checked + span { }
  input:enabled + span { }
  input:disabled + span { }
  구조 가상 클래스 셀렉터 (외울 필요는 없습니다)

• p:first-child { }
  ul > li:last-child { }
  ul > li:nth-child(2n) { }
  section > p:nth-child(2n+1) { }
  ul > li:first-child { }
  li:last-child { }
  div > div:nth-child(4) { }
  div:nth-last-child(2) { }
  section > p:nth-last-child(2n + 1) { }
  p:first-of-type { }
  div:last-of-type { }
  ul:nth-of-type(2) { }
  p:nth-last-of-type(1) { }
  부정 셀렉터

• input:not([type="password"]) { }
  div:not(:nth-of-type(2)) { }
  정합성 확인 셀렉터

• input[type="text"]:valid { }
  input[type="text"]:invalid { }