Front End

JS에서의 객체란? JS에서 객체는 프로그램에서 인식할 수 있는 모든 대상을 가르킨다. 객체 추상화 내가 코드로 표현하려고 하는 대상을 선택해서 속성, 동작들을 정의 모니터 속성 : 브랜드, 모델명, 크기, 색상, 가격 , 화소, ... (정의하기 나름) 동작 : 전원 on/off, 명도, 음량조절, ... (정의하기 나름) 인스턴스화 ⇒ 객체를 메모리에 올리는 작업 ★**[모든 프로그램은 주기억장치(RAM)에서만 실행된다]** 변수 vs 객체 변수 : 데이터를 저장하는 것 책상에 책을 꽂음, 책을 꺼내서 건네줌 함수 : 실행문(코드)을 저장하는 것 객체 : 데이터, 실행문(코드)을 둘 다 저장하는것 사물함 할당(책, 칫솔) 참조변수 (레퍼런스) : 변수는 저장하는 변수와 같은 메모리를 참조하게 된다. ..

무한루프를 사용할 경우 → 특정 동작을 무한히 수행해야할 떄 / 얼마나 반복해야하는지 알 수 없을 때 → 단점 : 코드 잘못 만들면 아무것도 실행x -> 보조제어문 통해 무한루프 빠져나올 수 있음 for(;;) { // 무한루프 } for(;true;) { // 무한루프 } while(true) { // 무한루프 } do{ // 무한루프 } while(true); 보조 제어문 break; (switch-case) : 가장 가까운 반복문 하나 탈출 => (이중for문 일 시 가장 가까운 for문만 빠져나감 - for문 하나만 빠져나올 수 있다.) continue; : 특정 조건을 무시하고 다음 반복문 실헹 => 단계스킵 특정 숫자 찾기 0.0 Quiz) { alert("오답! 더 작은 값을 입력하세요.")..

함수 선언과 실행 순서 // 전역변수 : 코드 전부에서 사용 가능 // => 어디서든 사용가능한 형태의 변수 var num = 100; function ex1() { // 지역변수 : 지역(블럭)에서 사용 가능 // => 특정 지역(함수)에서밖에 못씀 var num = 200; document.write(num+" "); // 지역변수가 필요한 경우 지역 안에 써줘야함 } // var num = 300; document.write(num+" "); ex1(); document.write(num+" "); var 변수(ES6) (p517~) 전역변수 : 모든 스코프(scope)에서 사용 가능한 변수 var a = 100; function TEST() { // var a = 100;(x -> 지역변수) a ..

함수(function) : 실행문(코드) 저장해서 사용 -한번에 코드를 저장해서 한번에 실행시키기 위해 사용함 함수명(); function 함수명() { //함수명은 의미있게, 주로 영문+숫자 실행코드1; 실행코드2; 실행코드3; } 익명함수 — 변수명() 사용 var tmp = function() { 실행코드1; 실행코드2; 실행코드3; } => 변수명() / 참조변수() ⇒ 변수 이름으로 호출 🔥 괄호 있으면 함수 괄호 없으면 변수 sayMyName 이름의 함수를 선언 => 본인의 이름을 출력하는 함수 function sayMyName() { document.write("내이름은 땅콩입니다."); } sayMyName(); 함수에 정보 전달하기 function 함수명(매개변수1, 매개변수2,..., ..

1. for문 for(초기식; 조건식; 증감식){ 반복할 코드(조건식이 참일때) } 초기식 초기식 → 조건식 비교 참일 때 코드 실행 반복할 코드가 없으면, 증감식→ 증감 연산자 사용 조건식 비교 참일 때 2~3번 과정 반복 거짓일 때 for문 빠져나옴 1-1. 숫자출력(1~10) for(var i=1; i

제어문 -프로그램의 흐름을 제어하는 문장 조건문 : 특정 조건에 따른 실행 (if / if-else / if-else if) 선택문 : 특정 조건에 따른 실행 (switch-case) 반복문 : 특정 조건에 따라 반복 실행 (for / while / do-while) 1. 조건문 1) 조건문 if문 *if문은 실행하는 코드가 1줄일때 중괄호 생략가능 Boolean(값) ⇒ t/f 리턴 -0, null, undefined, ""(공백문자) -> false -그 외 모든 데이터 => true if(0) { //false document.write("@@@@0@@@@"+ " "); } if(1) { //true document.write("@@@@1@@@@"+ " "); } if(2) { //true docu..

연산자 1) 산술연산자 (+ - * / %) // Q. 과일(50개)을 상자에 담으려고한다. // 이때 상자의 크기는 한번에 5개씩 저장가능 // 필요한 상자의 개수? var fruit = 50; var sizeOfBox = 5; document.write("필요한 상자의 개수: " + (fruit / box) + "개 "); box → sizeOfBox : box의 의미가 달라진다. — 협업을 위해 쓰는게좋음 // Q. 895 -> ???? -> 800 // 472 -> ???? -> 400 // 123 -> ???? -> 100 //952 -> ???? -> 900 (hint : 버림) var n1 = 952; document.write(n1-(n1%100)); //Q.856 -> ???? -> 85..

html: 웹문서를 나타내는 표현법 태그를 사용해서 정보를 표시한다. 태그: (항상 짝으로 사용) JavaScript: html 태그를 사용해서 여러가지 기능 처리 버튼으로 javascript 만들기 (1) - 버튼 head/body 안에 버튼 버튼 안에 글씨 버튼 누르면 javascript 버튼으로 javascript 만들기 (2) - 하이퍼링크 하이퍼링크 실행 =새로고침과 하이퍼링크 실행 버튼이 같다. (자바스크립트-헤드) "" 안에 주소가 없으면 나 자신을 새로고침한다. 하이퍼링크 실행 헤드안에 스크립트 바디안에 스크립트 바디안에 a태그 바디안에 input태그 5. javascript 코드만 작성하는 공간 // testScript.js // 자바스크립트 코드만 작성하는 공간 // 외부 파일 (단독실..