전체 글 (41) 썸네일형 리스트형 [Do it! - 자바스크립트 기본] 03. 변수와 자료형 그리고 연산자 03-1 변수란 무엇일까? 변수는 변하는 값을 저장할 때 사용한다 프로그램소개: 나이 계산하기 수식으로 알아보는 상수와 변수 나이 = 올해 연도 - 태어난 연도 + 1 - 나이, 올해 연도, 태어난 연도는 변하는 값이므로 변수(Variable), 1은 변하지 않는 값이므로 상수(Constant) 변수를 선언하는 규칙 세 가지 규칙1 - 이름은 의미 있게 짓는다 규칙2 - 여러 단어를 연결한 변수 이름은 낙타 모양으로 만들어 준다. 낙타 표기법(Camel Case) 규칙3 - 선언할 수 없는 이름도 있다 첫 글자는 문자나 밑줄, 달러 기호로 시작해야 한다 변수에 값이나 식 저장하기 나이 계산 프로그램 만들기 - 변수 선언하기 나이 계산하기 (결과 값 표시) 나이 계산 프로그램 만들기 - 사용자 입력값 변수.. [Do it! - 자바스크립트 기본] 02. 자바스크립트와 친해지기 02-1 개발 환경 준비하기 크롬 브라우저 설치하기 비주얼 스튜디오 코드 설치하기: code.visualstudio.com 비주얼 스튜디오 코드 한글판으로 바꾸기 색 테마 변경하기 02-2 비주얼 스튜디오 코드와 인사하기 작업 폴더를 설정하고 파일 열어 보기 다른 파일과 비교하며 코드 작성하기(측면에서 열기 기능) 라이브 서버 확장 기능 사용하기: 라이브 서버는 수정한 소스를 웹 브라우저에서 바로 확인할 수 있게 해줌. 저장만 하면 수정한 소스 결과 웹 브라우저에 바로 반영됨 02-3 자바스크립트 소스 작성하고 실행하기 HTML 문서 안에 자바스크립트 소스 작성하기 - 태그 안에 작성 - 보통 태그는 주로 HTML 문서 내용이 끝나는 태그 앞에 삽입함 외부 스크립트 파일 연결하기 - HTML 문서와 자바.. [Do it! - 자바스크립트 기본] 01. 안녕? 자바 스크립트! 01-1 웹 프로그래밍이란? 웹을 다루려면 웹 브라우저가 사용하는 언어인 '자바스크립트'가 필요하다. 프로그래밍이란 무엇일까? * 프로그래밍: 프로그램 만드는 과정. 사람이 원하는 대로 컴퓨터가 작동할 수 있도록 컴퓨터 언어로 명령어를 나열하는 행위 * 코딩과 프로그래밍 차이: 코딩이란 '소스 코드를 작성하는 행위'. 프로그래밍은 어떤 문제를 분석하고, 논리적으로 해결할 수 있는 방법을 찾아 코딩하는 과정까지 포함하는 더 넓은 개념 웹 프로그래밍은 무엇일까? * 웹 프로그래밍: 웹에 관련된 프로그램을 만드는 행위. 웹브라우저와 관련된 프로그램을 작성하는 것. * 서버: 사용자의 검색 요청을 처리해 알맞은 정보를 전달해주는 컴퓨터 * 클라이언트: 웹 브라우저, PC, 노트북 모바일 기기 등. 웹 브라우저를.. [생활코딩 - 자바스크립트 기본] 섹션4. 비교 ~ 섹션6. 반복문 섹션4. 비교 연산자: 값에 대해서 어떤 작업을 컴퓨터에게 지시하기 위한 기호 비교연산자: 주어진 값들이 같은지, 다른지, 큰지, 작은지. 결과는 true, false로 나옴 동등연산자 equal operator == 일치연산자 strict equal operator === 일치연산자 쓰기 섹션5. 조건문 섹션6. 반복문 * 디버거 [TCP스쿨 - AJAX] 3. 서버와의 통신 7) XMLHttpRequest 객체 * XMLHttpRequest 객체 - Ajax의 가장 핵심적인 구성 요소는 바로 XMLHttpRequest 객체이다. - Ajax에서 XMLHttpRequest 객체는 웹 브라우저가 서버와 데이터를 교환할 때 사용된다. - 웹 브라우저가 백그라운드에서 계속해서 서버와 통신할 수 있는 것은 바로 이 객체를 사용하기 때문이다. * XMLHttpRequest 객체의 역사 - 비동기식 통신 방식인 XMLHttp는 가장 처음으로 익스플로러 5 버전에서 ActiveXObject라는 객체를 사용하여 구현되었다. 그 후에 모질라와 사파리에서 XMLHttpRequest라는 이름으로 도입하여 널리 사용되기 시작한다. - 초기의 XMLHttpRequest 객체는 W3C 표준이 아니었기.. [TCP스쿨 - AJAX] 2. Ajax 기본 4) DOM * 문서 객체 모델(DOM)이란? 문서 객체 모델(DOM, Document Object Model)은 HTML 문서나 XML 문서에 접근하기 위한 일종의 인터페이스이다. 이 모델은 문서 내의 모든 요소의 목적과 특징을 정의하고, 각각의 요소에 접근하는 방법을 제공한다. * DOM 요소의 선택 자바스크립트로 DOM 요소를 다루기 위해서는 우선 해당 요소를 선택해야만 한다. DOM 요소를 선택하는 방법은 다음과 같다. 1. 태그 이름(tag name)을 이용한 선택 2. 아이디(id)를 이용한 선택 3. 클래스(class)를 이용한 선택 4. CSS 선택자(selector)를 이용한 선택 5. HTML 객체 집합(object collection)을 이용한 선택 * DOM 요소의 내용 변경 - D.. [TCP스쿨 - AJAX] 1. Ajax 시작 1) Ajax 개요 * Ajax는 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있게 해준다. 즉 Ajax를 이용하면 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있다. 2) Ajax 기초 * HTML, 자바스크립트, XML 기초 지식 갖고 있으면 좋음 * Ajax란? - Ajax란 Asynchronous JavaScript and XML의 약자. asynchronous 비동기 - Ajax는 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법의 하나이다. - 백그라운드 영역에서 서버와 통신할 때 다음과 같은 형태의 데이터를 주고 받을 수 있다. (JSON, XML, HTML, 텍스트 파일 등) * Ajax의 장점 1. 웹 페이지 전.. [생활코딩 - 자바스크립트 기본] 섹션0. 오리엔테이션 ~ 섹션3. 변수 섹션0. 오리엔테이션 * JavaScript란? 웹브라우저를 프로그래밍적으로 제어하기 위한 언어 * 탈웹브라우저 - 웹브라우저 뿐만 아니라 웹서버에서도 동작하는 Node.js 각광받고 있음. - 웹서버, 웹브라우저에서 자바스크립트로 통일 가능하다는 장점. * 탈웹 - 자바스크립트가 웹 밖의 기술에서도 사용되기 시작 - Google Apps Script(구글 스프레드 시트) 섹션1. Javascript 기본 - 실행방법과 실습환경 - 크롬 개발자 도구: alert, console.log.. 섹션2. 숫자와 문자 * 자바스크립트 Math 객체 https://pingfanzhilu.tistory.com/entry/Javascript-Math-%EA%B0%9D%EC%B2%B4abs-round-ceil-floor.. 이전 1 2 3 4 5 6 다음
