[멋사 프론트엔드 스쿨]10월 5일 수요일 TIL_반응형 웹, 웹의 역사, JS배열

회사 코딩 테스트를 볼 때

알고리즘 책을 옆에 두기 (구글 검색보다 빠르고 정확할 수 있다)

코딩 테스트 후 면접이 진행되므로 문제를 못 풀었다고 쳐져있는 것 보단

시간이 15분정도 남았을 때 이 알고리즘이 어떤걸 묻는 문제이며 어떤식으로 풀려고 했는 지 머릿속으로 정리해보자

(문제를 풀지 못했다고 탈락이 확정은 아니다!)

 

반응형 웹 완성

 

태블릿, 모바일 버전 마무리

 

• max-width만 주고 rem환산하여 수치입력
  (font-size에 따라 padding도 커지길 원한다면 em으로 준다.
  rem은 루트 요소의 폰트 사이즈, em은 부모 요소의 폰트 사이즈를 상속받기 때문)
• 요소선택자로 선택하는이유는 좀 더 정확하게 선택할 수 있으므로
• flex-basis는 axis 방향에 따라 flex가 column 방향일때 높이로 유연한 컨텐츠 크기 조정 가능
• 컨텐츠가 없을때 필요한 경우 높이를 지정해주기도 하긴 하지만
  안에 컨텐츠가 있는 경우는 높이값을 직접 지정해 주는 경우는 거의 없다
• 콘텐츠가 많아지면 어떤 화면이든 레이아웃이 깨지지 않게 하기는 쉽지않다
  근데 누가 화면을 늘렸다 줄였다 확인하는 경우가 개발자가 아니고서야..
  그 시간에 다른곳에 리소스를 투여하는게 효율적

https://devlog.jwgo.kr/2019/01/16/why-we-use-625p-instead-of-10px/

왜 많은 사람들이 CSS 기본 설정으로 62.5%를 쓰는 걸까? · Tonic

웹의 역사

• 최초의 컴퓨터
• 최초의 웹사이트

http://info.cern.ch/

http://info.cern.ch

• 닷컴 버블
• 브라우저 전쟁
  모자이크 > 넷스케이프 내비게이터 > 인터넷 익스플로러
  모질라 파이어폭스, 사파리, 오페라, 크롬
  
  

짤의 출처: https://www.youtube.com/watch?v=taJV5cigzNY 

 

배열

• {리터럴} [배열의 리터럴]
• 리터럴은 할당되기 전의 값이다
• 문자열의 배열 특성은 불변성이다
• mutable(가변), immutable(불변) 많이 듣게 될것
• 희소 배열
• Array.메소드
  Array.prototype.메소드
  ????
• unshift() : 맨 앞에서 요소를 추가할 때
• shift() : 맨 앞에서 요소를 제거할 때
• splice() : 요소를 위치할 인덱스(음수일땐 뒤에서부터), 제거할 요소 개수, 배열에 추가할 요소
• slice() : 잘라낼 배열의 시작 인덱스, 종료지점 인덱스(생략시 끝까지 추출된다)
• indexOf() : 찾을 요소, 탐색을 시작할 인덱스(생략가능)
  탐색되지 않았을 땐 -1이 출력된다
• join() : 요소들을 ()로 연결해 하나의 값인 문자열로 만들 때
• fill() : 똑같은 요소들로 채울때(많이쓴다?)
• flat() : 평탄화할 때 (알고리즘 문제 풀 때, 재귀적으로 평탄화 할 수 있다)
• includes() : 특정 요소가 있는지 확인할 때
• find() : 하나의 요소라도 조건을 만족하는지 확인할 때
• filter() : 모든 요소가 조건을 만족하는지 확인할 때
• map() : 함수 호출할 때
  filter는 조건 메소드가 자체적으로 있고 map은 따로 없다
  (함수자리에 조건문을 걸면 메소드처럼 쓸 수 있다) 
• forEach() : 각 요소 콜백 1회씩 실행
• sort() : 요소 정렬 (유니코드 오름차순)

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array#%EB%A9%94%EC%84%9C%EB%93%9C

Array - JavaScript | MDN

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

Map - JavaScript | MDN