js document 객체
document 객체는 웹페이지 그 자체를 의미한다.
documnet 객체에서도 다양한 메서드들을 제공하는데
요소 선택,
요소 생성,
이벤트 헨들러 추가,
객체의 선택 등이 있다.
LAB1
alert : 경고 문을 띄워 준다
.onchange : 안의 내용이 바뀔때에 이벤트 실행
.onclick : 클릭 이벤트가 발생 했으 때에 이벤트 실행
.write() : html 출력 스트림을 통해서 텍스트 출력
.getElementById : html tag의 id 를 통해서 태그를 선택
.innerHtml : 선택한 태그 안에 html 작성
이러한 자바스크립트 함수들을 html 태크안에 배치 시킬 수 도 있다.
LAB2
split(separator, limit) : 문자열을 separator 로 잘라서 limit 보다 작은 길이로 나누어서 배열로 만듭니다.
fs.readFileSync() : 파일을
.toString() : 객체의 메서드로 문자열 형태의 객체를 반환한다.
동기식이란 하나의 함수가 끝나면 그 다음 것 이렇게 차례로 실행하는 것이다.
비동기식이란 하나의 함수가 끝날 때까지 기다리지 않고 병렬적으로 실행시킨다.
najax : 이는 npm 에서 제공하는 ajax 통신이라고 하는데 비동기 처리의 대표적인 사례이다.
ajax 통신은
이렇게 작성하고 작동 방식은 ajax의 메서드인 .get 에서 반환값을 콜백함수의 인자로 전달 해 준다.
또 다른 비동기로는 setTimeout() 이 있다. 이는 지정한 시간을 기다렸다가 콜백 함수를 호출하는 형태이다.
LAB3
.parse : JSON 객체의 메서드로 JSON 형식을 객체 object 로 변환해 주는것이다.
new : 커스텀 객체나 내장 객체 타입의 인스턴스를 생성 할 때에 사용된다. \
LAB4
$.ajax 이는 jquery 의 문법으로
이곳에서의 $는 jquery 를 의미한다.
$(제어대상) 이런식으로 제어대상을 설정할 수 도 있다.
$.ajax() 이렇게 나타낸다면 안에 url 을 지정하여 해당 주소로 query 를 보내면서 통신을 한다.
이때 안에는 객체 형식으로 값을 넣어 주고 객체 안에 success 메서드를 작성 할 수 있는데 ,이 메서드는 받은 값에 따라서 그에 대한 행동을 지정 할 수 있다.
LAB5
chainning method
체이닝 메서드란 메서드를 계속 계속 이어 붙이는 것을 말한다. 이때의 이점은 메서드에서 this 를 받을 때에 있어서 현재 객채에서의 변경 된 값을 계속 유지가 가능하다. 계속 같은 값을 유지 하기 위해서 같은 객체를 계속 부를 필요 없이 그냥 메서드 뒤에 베서드를 붙이면서 나아갈 수 있다.
composite
이는 프로토 타입 메서드를 생성 할 때에 한번에 생성을 하게 해주는 방식을 말한다.
이런 식으로 객체에 메서드를 생성하여 넣어줌으로서 객체의 커스텀 메서드를 생성 할 수 있다.
.splice 는 배열에서 요소를 삭제해주는 메서드 이다. (i,1) 에서 i 는 몇번째 부터 지울 것인지, 1은 몇개를 지울것이지 이다.
또한 이런식으로 객체 생성자를 생성 할 때에 안에 메서드까지 정의가 가능하다.
생성자를 작성 할 때에는 함수의 형식으로 작성하고 this는 인스턴스를 생성 할때에 있어서 자기자신을 뜻한다.
forEach() : 안에 있는 콜 백 함수를 각각의 인덱스마다 실행을 시켜주는 함수이다.
Decorator
생성자를 두개 이상을 만들 때에 생성자에서 다른 생성자를 가져올 수 있다.
DecoratedUser 에서 User 의 메서드를 불러와서 사용 가능하다.
Observer
.trim() : 양쪽 공백 제거
Proxy
wrapper 을 먼저 실행시킨다. 감싸고 있는 것을 먼저 실행 시킵니다.
LAB6
react
react return 안에는 <> </> 로 감싸주어야한다.
return 문 안에 {} 를 넣으면 조건문이나 변수들을 사용할 수 있다.