Javascript 11

부스트코스 서포터즈 3기를 마치며..

#이제부터가 시작 1월 7일부터 시작한 '입문 자바스크립트의 시작' 과정을 모두 마쳤다. 시작은 별 생각없이 참여하게 되었지만 어느 순간부터 주말에 부스트코스를 들으며 블로그에 글을 적는게 하나의 즐거움으로 자리 잡게 되었고 덕분에 블로그에 다른 글들도 쓰면서 블로그에 글쓰기가 취미가 되었다. 뿐만 아니라 비개발자도 이해하기 쉽고 듣기 편안했던 강의 덕분에 어느 정도 프로그래밍에 자신감을 생긴게 가장 큰 Benefit이 아닐까 싶다. (이고잉님의 목소리가 너무 좋았고 편안해서 공부한다는 느낌보다는 라디오 듣는 느낌에 정말 편안하게 수업을 들었다.) 자바스크립트에 관심을 갖게 되었던 것은 IT기획 업무를 하고 있는 것도 그렇지만 예전에 우연히 구글 본사에서 근무하는 한국인 구글 엔지니어가 처음 배우기 좋은..

10. Quiz 5

Q1. 더보기 [해설] js파일을 불러오기 위해서는 script src를 사용한다. Q2. 한번 다운로드된 js파일을 브라우저가 저장하고 다음에 접속할 때 저장된 파일을 읽어서 네트워크를 통하지 않도록 하는 기술로 올바른 것을 고르시오. (1) cache script web file 더보기 [해설] 캐시(Cache)는 컴퓨터 과학에서 데이터나 값을 미리 복사해 놓는 임시 장소를 가리킨다. Q3. 내가 만들고자 하는 프로그램에 필요한 부품이 될 기능을 제공하는 것으로 올바른 것을 고르시오. (1) library framework property attribute 더보기 [해설] 라이브러리는 프로그램에 필요한 부품이 되는 소프트웨어가 정리되어 있는 것 Q4. 라이브러리를 직접 다운로드받지 않고, 에 URL을..

9. Javascript 활용

js 파일 불러오기 js 파일 이용의 장점코드를 재사용 용이유지보수의 편의성 클린 코드와 가독성 용이빠른 페이지 로드 라이브러리(Library) vs 프레임워크(Framework) 라이브러리는 프로그램에 필요한 부품이 되는 소프트웨어가 정리되어 있는 것프레임워크는 만들고자 하는 프로그램의 종류에 따라서 공통적인 부분을 미리 만들어놓는 것 대표 라이브러리 jQueryhttp://www.jquery.com/jQueryWhat is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animatio..

8. Quiz 4

Q1. 객체에 대한 설명으로 옳은 것을 고르시오. (4) 조건에 따라 실행할 코드를 선택하기 위한 도구이다. 순서가 있는 값을 정리정돈하기 위한 도구이다. 조건에 따라 코드를 반복시키기 위한 도구이다. 서로 연관된 함수와 변수를 그룹화해서 정리정돈하기 위한 도구이다. 더보기 [해설] 객체는 서로 연관된 함수와 변수를 정리하기 위해 사용한다. Q2. 객체를 만들기 위한 방법으로 옳은 것을 고르시오. (1) var coworkers = {"programmer" : "egoing"}; var coworkers = ["programmer", "egoing"]; var coworkers = "programmer"; var coworkers = programmer("egoing"); 더보기 [해설] 객체를 만들기 ..

7. Javascript 객체

객체(Ojbect) vs 메소드(Method) 객체는 함수의 기반 위에서 존재하는 개념으로 서로 연관된 함수와 변수를 정리하기 위해 사용한다.아래 코드에서 document가 객체, querySelector(함수)는 메소드이다.document.querySelector('body'); 객체를 만들 때는 배열과는 달리 중괄호{}를 사용한다. var coworkers= { "programmer": "egoing" };객체를 불러올 때는 대괄호[]를 사용한다.document.write(coworkers["programmer"])객체 요소를 추가하는 방법 아래와 같다. coworkers["bookkeeper"] = "duru"; 객체의 순회(Iteration)객체에 있는 모든 값들을 가져오기 위해서는 for in을..

6. Quiz 3

Q1. 함수에 대한 설명으로 올바른 것을 고르시오. (2) 코드를 반복하기 위한 도구 코드를 잘 정리정돈하기 위한 도구 코드를 실행할지 선택하는 도구 값을 순서대로 정리해주는 도구 더보기 [해설] 함수를 사용하면 코드의 관리가 용이해지고 짧아져 성능은 물론 유지보수 관리가 쉬워진다. Q2. 함수의 장점으로 올바르지 않은 것을 고르시오. (4) 특정 기능이 변경될 때 한 곳만 수정하여 해결할 수 있다. 공통된 코드가 한줄로 줄어들어 웹 페이지의 크기가 줄어든다. 사용하는 곳에서 기능이 모두 동일하다는 것을 확신할 수 있다. 여러 값을 하나의 변수에 순서대로 담을 수 있다. 더보기 [해설] 여러 값을 하나의 변수에 담는 것은 불가능하다. Q3. 함수를 선언하기 위한 키워드로 올바른 것을 고르시오. (2) w..

5. Javascript 함수

함수(function)란? nightdayhandler라는 함수를 통해 모든 input 태그를 핸들링 할 수 있다. 함수 사용의 장점 1. 코드의 유지보수가 쉬워진다. 하나의 함수를 여러군데에서 사용할 때, 이를 하나하나 바꿔줄 필요 없이 함수를 만들어 준 곳에서만 바꿔주면 된다. 즉, 효율성과 실수를 줄여준다. 2. 코드의 길이가 짧아진다. 같은 코드가 계속해서 반복되는 것을, 딱 한 번만 써줌으로 인해서 웹페이지의 크기를 줄여줄 수 있고, 이로 인해 전송 속도가 빨라진다. 즉, 성능이 좋아진다. 3. 함수를 사용하면 두 코드가 논리적으로 같다는 것을 한 번에 알 수 있고, 적절한 이름을 붙여주면 이 코드가 어떤 일을 하는지 한 눈에 알 수 있다. 즉, 다른 사람이 내가 작성한 코드를 보기 용이해지고 ..

4. Quiz 2

Q1. 다음 중 연산 결과가 Boolean이 아닌 것을 고르시오. (2) x===y x=y xx>y 더보기 [해설1] Boolean 자료형은 값이 Ture 이거나 False이다. '=' 는 대입 연산자이다. Q2. 다음 코드의 실행 결과로 옳은 것을 고르시오. (3) var num = 2; if (num === 1) { document.write("사과"); } else { document.write("딸기"); } if (num === 2) { document.write("바나나"); } else { document.write("수박"); } 딸기수박 사과수박 딸기바나나 사과바나나 더보기 [해설2] 변수 num은 2 이므로 첫번째 조건문에서 1이 아니므로 딸기가 출력되며,두번째 조건문에서 2가 맞으므로..

3. Javascript 제어문

컴퓨터 언어 vs 프로그래밍 언어 프로그램에는 순서가 있으며, 이러한 순서를 만드는 것이 프로그래밍 언어이다. 즉, HTML로 만든 웹페이지는 시간의 순서가 없고 한번 만들어지면 변하지 않는다. 반면에 Javascript는 사용자와 상호 작용하며 시간에 따라 여러 기능이 실행된다. 따라서, HTML은 컴퓨터 언어이지만 프로그래밍 언어는 아니다. 조건문(if/else) 프로그램이 조건에 따라서 다른 기능들이 다른 순서에 따라서 실행되도록 만들어 주는 것 if(document.querySelector('#night_day').value === 'night') { document.querySelector('body').style.backgroundColor = 'black'; document.querySele..

2. Quiz1

Q1. Javascript의 특징으로 올바른 것을 고르시오. (1) 웹 페이지를 동적으로 만들어주는 언어이다. 웹이 세상에 처음 등장했을 때 사용하던 단 하나의 언어이다. 화면에 웹을 보여주고 그 모습 그대로를 유지하는 언어이다. 웹 페이지를 디자인하기 위한 언어이다. 더보기 [해설1] 2. 웹이 세상에 처음 등장했을 때 사용하던 단 하나의 언어는 HTML이다. 3. 화면에 웹을 보여주고 그 모습을 그대로 유지하는 언어는 HTML이다. 4. 웹 페이즈를 디자인하기 위한 언어는 CSS이다. Q2. HTML에 Javascript를 작성하기 위해 사용하는 태그를 고르시오. (1) 더보기 [해설2]2. 는 웹페이지의 본문을 나타내기 위한 태그이다. 3. 는 메타데이터를 정의하기 위한 태그이다. 4. 는 제목을 ..