분류 전체보기 35

[Javascript] 자바스크립트 객체란, 객체의 종류(내장, 브라우저, 문서 객체)

객체란?자바스크립트는 개체 기반 언어입니다. 객체는 기능과 속성을 가지고 있습니다.예로 TV에는 켜다, 끄다, 볼륨을 높이다, 줄이다 등의 기능이 있습니다.​앞의 포스팅에서는 document라는 객체를 사용해 보았고, 출력이라는 기능을 사용해 보았습니다.이런 기능들을 메서드(Method)라고 합니다. 또한 객체는 속성(Property)을 가지고 있습니다.예로 TV의 크기나 색상, 무게 등을 속성이라고 할 수 있죠! 기본형)객체.메서드();객체.속성 또는 객체.속성 = 값;​ 객체의 종류자바스크립트의 객체는 크게 내장 객체, 브라우저 객체모델(BOM, Browser Object Model), 문서 객체 모델(DOM, Document Object Model)로 나눌 수 있습니다.​내장 객체내장 객체로는 문자..

[Javascript] 자주쓰는 함수 charAt, concat, Math.floor, getDate, getTime등

날짜 관련 메서드 날짜 정보를 가져올 때(GET)날짜 정보를 수정할 떄(SET)getFullYear()연도 정보를 가져옴setFullYear()연도 정보만 수정함getMonth()월 정보를 가져옴(현재 월-1)setMonth()월 정보만 수정함(월 -1)getDate()일 정보를 가져옴setDate()일 정보만 수정함getDay()요일 정보를 가져옴(일: 0 ~ 토:6)요일은 날짜를 바꾸면 자동으로 바뀌므로 setDay()는 없음getHours()시 정보를 가져옴setHours()시 정보만 수정함getMinutes()분 정보를 가져옴setMinutes()분 정보만 수정함getSeconds()초 정보를 가져옴setSeconds()초 정보만 수정함getMilliseconds()밀리초 정보를 가져옴(1/100..

[Javascript] 선택문 switch, 반복문 while, dowhile, for, break, continue

선택문Switch 문선택문인 switch 문은 변수에 저장된 값과 switch 문에 있는 경우의 값을 검사하여 변수와 경우의 값에서 일치하는 값이 있을 때 그에 해당하는 코드를 실행합니다. if문은 만족하는 데이터가 여러 개일 경우에 주로 사용하고, switch문은 여러 경우의 값 중 일치하는 데이터를 찾아 그에 해당하는 코드를 실행시킬 때 사용합니다.기본형)var 변수 = 초기값;switch(변수) {   case 값1 : 코드 1;   break;   case 값1 : 코드 1;   break;   case 값1 : 코드 1;   break;​   default : 코드 5;}반복문1.while 문while 문은 조건식을 만족할 때까지 여러번 반복할 수 있습니다.기본형)var 변수 = 초기값;whil..

[Javascript] 조건문(제어문) IF문, 중첩IF문

제어문은 프로그램의 흐름을 제어할 수 있도록 도와주는 문장을 말합니다. 제어문에는 조건의 만족 여부에 따라 코드나 값이 달라지게 됩니다.조건문과 선택문, 반복문이 있는데 한가지씩 알아보겠습니다 조건문조건문은 조건식의 값이 참인지, 거짓인지에 따라 JavaScript 코드를 제어합니다.조건문의 종류에는 if 문, else문 그리고 else if 문이 있습니다. 1.if문if문은 조건식을 만족할 경우에만 코드를 실행합니다.true 또는 false를 무조건 반환하며 기본형과 간단한 예를 살펴보겠습니다. if (조건식) {   코드; }기본형은 이렇게 쓰이고요. 이해를 위해 예제를 하나 보겠습니다.var num=10;if (num    document.write("hello");}num이 500보다 작기 때문에..

[Javascript] 기초문법(4) 논리, 삼항 연산자, 연산자 우선순위

논리 연산자논리 연산자의 종류종류설명||or 연산자라 부르며, 피연산자 값 중 하나라도 true가 있다면 ture를 반환&&and 연산자라 부르며, 피연산자 값 중 하나라도 false가 있따면 false를 반환!not 연산자라 부르며, 피연산자 값의 반대 결과를 반환(true면 false를 반환)  연산자 우선순위1. ()2. 단항연산자(--, ++, !)3. 산술 연산자(*, /, %, +, -)4. 비교 연산자(>, >=, )5. 논리 연산자(&&, ||)6. 대입 연산자(=, +=, -=, *=, /=, %=)  삼항 조건 연산자조건식의 결과에 따라 값이 달라지며, 연산을 위해서 피연산자 3개가 필요합니다.기본형)조건식 ? 코드1 : 코드2;조건식이 true라면 코드1을, false라면 코드2를 리..

[Javascript] 기초문법(3) 문자결합, 대입/증감/비교 연산자

연산자에는 덧셈, 뺄셈, 곱셈, 나눗셈, 나머지 이렇게 있는데요. 숫자를 가지고 기본적인 실습은 어떤 언어로든 한번씩 해보게 됩니다. 좀 더 들어가서 문자 결합 연산자부터 대입, 증감, 비교, 논리 삼항 조건 연산자까지 알아보겠습니다. 문자결합 연산자문자형 데이터 + 문자형 데이터 = 하나의 문자형 데이터 "hello" + " world" = "hello world"; 문자형 데이터 + 숫자형 데이터 = 하나의 문자형 데이터 "100" + 200 = "100200"; 숫자형과 문자형을 더하기 연산하면 하나의 문자형 데이터가 됩니다. 대입연산자대입연산자는 = 을 말합니다. 프로그래밍 언어에서는 대입연산자(=)는 같다라는 뜻이 아니라 우변의 데이터를 좌변에 대입한다라는 뜻입니다. 복합 대입 연산자는 산술 연..

[Javascript] 기초문법(2) 변수선언, 자료형, 변수선언시 주의사항

변수란?데이터(값)를 저장할 수 있는 메모리 공간을 뜻합니다. 변수에는 오직 한 개의 데이터만 저장됩니다. 새로운 데이터가 들어오면 기존의 데이터는 사라집니다. 변수 선언var 키워드를 변수명 앞에 붙입니다. var 변수명; 또는 var 변수명 = 값; 이런식으로 변수를 선언합니다. 변수에 저장할 수 있는 자료형문자형(String), 숫자형(Number), 논리형(Boolean) 그리고 빈 데이터(Undefined)가 있습니다. 1. 문자형 var 변수 = "문자"; 큰 따옴표 안에 숫자 등 어떤것이 들어가도 문자형으로 인식됩니다. 단, html 태그를 포함하여 출력하면 태그로 인식됩니다. 2. 숫자형 var 변수 = 숫자; 문자형 데이터를 숫자형으로 변경하고 싶다면 Number("문자형 숫자");를 사..

[Javascript] 기초문법(1) 선언문, 주석, 내부스크립트 외부 분리

자바스크립트 선언문자바스크립트 코드를 쓸 영역을 선언하는 것입니다. 태그 종료까지가 JS코드가 들어갈 영역입니다. 또는 태그 안에 선언하면 되지만~ 대부분 태그 아네에 선언하기 때문에 태그 안에 선언해보겠습니다. 자바스크립트 주석 처리코드가 아닌, 코드에 대한 설명을 넣고 싶다면 주석 처리하면 됩니다. //한줄 주석 /* 여러줄 주석 */ 참고로 HTML 소스 주석은 이렇게 처리하면 됩니다. 내부 스크립트 외부로 분리하기html 내부에 작성된 자바스크립트는 외부로 분리해주어야 합니다. 이유는 소스찾기도 쉬워지고 손상될 염려도 적어지듯 프로젝트 관리를 원활하게 하기 위합니다. html 코드 안에 JS 코드가 적혀 있는 파일경로를 지정해주면 됩니다. 기본형은 이렇게 작성하면 됩니다. 1. html 내부에 s..

[VScode] 비주얼 스튜디오 코드 한글 버전으로 전환

처음 비주얼 스튜디오 코드(VS code)를 설치하면 기본값이 영어로 셋팅되어 있습니다.한글버전으로 바꾸는 방법에 대해 알아보겠습니다. 1.VS Code를 실행시킨 후 뷰 바에서 [확장] 버튼을 눌러주세요.  2.확장 버튼 클릭 후 검색창에 'korean'이라고 적은 후 아래에 Microsoft가 제작자인 Korean Language Pack for Visual Studio Code를 선택해주세요. [설치] 버튼을 눌러 설치하고 우측 하단에 재시작 버튼이 나오면 클릭해 VS Code를 재실행해주세요. 그럼 한글로 버전으로 변경완료되어 있을거에요. 3. 언어를 영어에서 한글로, 한글에서 영어로 자유자재로 변경하는 방법을 알아보겠습니다. 상단 메뉴 바에서 보기 > 명령 팔레트를 클릭해주세요.  4.검색창이 ..

[Javascript]비주얼스튜디오코드 확장 기능 이용해 HTML소스 크롬으로 띄우기

1.먼저 실습해볼 파일을 저장할 폴더(전 C: 에 workspace_JS라는 폴더를 생성했습니다)를 만들어주세요. 먼저 비주얼스튜디오코드 화면에서 뷰 바 - 탐색기를 클릭해주세요. 사이드 바에 탐색기가 나타나면 [폴더 열기] 버튼을 눌러 생성한 workspace_JS 폴더를 찾아 선택해주세요. (탐색기에 폴더를 드래그 앤 드랍해도 됩니다)  2.탐색기에서 불러온 폴더에 마우스 포인터를 올려놓고 새파일 생성 버튼을 클릭해 새 HTML 파일을 생성합니다. 파일 이름은 index.html로 하겠습니다.   3.index.html을 열어주세요. HTML 기본 양식을 작성할 때는 비주얼 스튜디오 코드에 포함된 이멧(Emmet) 기능을 이용하면 편합니다. 이멧 기능은 HTML, CSS를 약식으로 표기하여 작성할 수..