FE = > 페이지 구현
다른 개발자의 시간 줄여주는 작업
깃헙 핀 위치도 고려할 것.
자기 객관화 필요.
나의 지금 실력. ?
카카오, 네이버 지금 코테 ..대기업 시니어들 모임.. 난이도 엄청 어렵구나
할당아무것도 안된 것 (메모리도 안잡음)
실무에서 실수 조심할 것
Array(100).fill(0).map((value,index) =>index+1)
반환값
=>배열의 각 요소에 대해 실행한 callback의 결과를 모은 새로운 배열
232 = 2**9 = 512 나옴 (뒤부터 연산된다.)
Math.pow(Math.pow(2,3),2)
Math.pow(2,3) = 8
split + 메서드체인하면 분리됨
map: 콜백함수의 반환값으로 이루어진 배열을 반환합니다 (원본 배열은 유지)
forEach: 아무것도 반환하지 않고 콜백함수만 실행됩니다
today.toISOString().split('-').map(v => parseInt(v))
Math 함수
reduce
레거시 코드에서 보게 될 것. 실제로는 사용 거의 x. => for Each
arr.reduce((sum, current)=> sum *current);
sum은 누적값 current는 arr의 하나씩 요소.
epsilon
허용오차
Number.EPSILON => js에서 언제든지 날 수 있는 연산의 오차!
이 값을 넘으면 받지 않겠다.
flat()
나는 무조건 다 피겠다.
arr.flat(Infinity)
2개 피겠다
arr.flat()
겉에 빼고 안에 2개 있으면
arr.flat(2)
use strict 모던 스크립트
변경사항 대부분 ES5의 기본 모드에서 활성화되지 않도록 설계했다.
하위 호환성 문제있기에, use strict추가해야 사용가능.
거의 대부분은 use strict 적용안한다.
스크립트마다 따로 변수명 분할 =>스크립트 변수충돌되서 에러나올 수 있음
폴리필
바벨 읽어보기
this : 자신을 호출한 객체, 자신이 생성한 객체
name앞에는 window.생략되어있다.
window.name
자기자신을 호출한 객체의 네임
let name을 쓰면 window의 name이 변경되지 않음
let 호텔 = [{
'이름' : '하나호텔',
'위치' : '제주도 제주시 001',
'가격' : {'A':50000, 'B':30000, 'C':15000},
'방의개수' : 50,
'예약자수' : 25,
'남은방의개수' : function(){return this.방의개수 - this.예약자수}
},{
'이름' : '둘호텔',
'위치' : '제주도 제주시 002',
'가격' : {'A':100000, 'B':60000, 'C':30000},
'방의개수' : 100,
'예약자수' : 30,
'남은방의개수' : function(){return this.방의개수 - this.예약자수}
},{
'이름' : '셋호텔',
'위치' : '제주도 제주시 003',
'가격' : {'A':80000, 'B':50000, 'C':30000},
'방의개수' : 120,
'예약자수' : 80,
'남은방의개수' : function(){return this.방의개수 - this.예약자수}
}];직접 들어가는 것보단, 밖에서 호출할 수 있도록 하는게 좋다.
ex) onclick에서 .
이게 보이면 회사에서 도망쳐!!! 마크업에 js바로 쓰면 혼합해서 쓴다는것.
h1 style="color" 엉망일 확률 높다
스크립트는 스크립트 따로, 스타일 따로!
apply()
메서드의 인수에 this로 사용할 값을 전달할 수 있으며, 배열의 형태로도 전달할 수 있다.
다른 객체에서 재정의하지않고 사용할 때.
call()
주어진 this 값 및 각각 전달된 인수와 함께 함수를 호출
다른 함수 사용하며 내 거를 사용하고 싶을때.
사용할 함수.call(내 인자)
bind()
this가 고정된 새로운 함수를 반환
나를 호출한 객체의 이름을 출력하라.
var bruce3 ={
name: 'bruce'
sayName: '
sayName.binc(bruce)) 브루스가 고정되어있다.
closure
- 사용하는 이유: 변수 은닉(좀 더 견고한 코드), 메모리 효율, 코드 효율(또는 완전성)극대화
- 클로저를 생각하며 코딩을 함. or 이해
- 함수 내부에서 선언. debugger를 통해 closure확인 가능 -코드 멈춤
- 원의 넓이 , 정해진 함수 이용할 때
엄격모드 함수 내부에서 쓸 수 있지만. 어떤 건 최신 문법쓰고, 어떤 건 안쓰는 혼합이 생기기에, 잘 쓰지않는다.함수
- 생성자 함수와 일반 함수에 기술적 차이 없음
- 함수 이름 첫 글자는 대문자
- 재사용할 필요 없을때 익명 생성자 함수로 감싸주는 방식 사용할 수 있음.
- new를 붙여주면 안에 있는 객체 접근 가능 new User("로로")
JSON
(Javascript Object Notation)
자바스크립트에서 객체를 표현하는 형식으로 데이터를 표현한 것
다른 방식에 비해 가볍고 js 호환성이 높아 널리 사용.
= 텍스트로 표현된 정보의 덩어리
XML
배열 데이터의 표현방식이 언어마다 달라 애를 먹음. 하지만 숫자와 문자열은 언어마다 표현방식이 같아, 이를 이용해서 만든 대표적인 데이터 폼이 xml이다. 후에 더 복잡한 구조를 더 단순히 하고자 탄생한 것이 JSON이다.
join사이니까 마지막은 없다.(연결할 때 사용)
변수 최대한 적게 사용하는게 좋다.
풀이 1번 canvas ( 차트 )
js>021.html
table_rendering_canvas
