모-코드

I. INTRO : 들어가며 오늘은 디스트럭쳐링 배열을 한다. II. ES6 1. Array Destucturing 1) let kors = [1,2,3]; let[kor1, kor2, kor3] = kors; console.log(kor1); let kors2 = [3,4,5]; [kor1, kor2, kor3] = kors2; console.log(kor1); 이렇게 하면 된다 - 이경우 let때문에 아래 kor1 관련부분은 건들면안된다. 2) let std1 = {name : 'dragon' , phone : '010'}; ({name,phone}= std1); console.log(phone); = 때문에 선언으로 보이지만, 디스르럭쳐링을 하려면 전체를 괄호로 감싸라고 한다. 오류 때문에 전체를(..

I. INTRO : 지난시간 II. 값 변수 컬렉션 : ES6 1. Binary and octal Literals ES6는 몇가지 달라졌다. (1). 2진수와 8진수의 기호를 표현할 수있다. : 기존에 없던 값 표현식으로 이진수(b)와 8진수(o)가 추가되었다 ES6에서 이제 표현하는 방법이 추가되었다 2. let 키워드 (1) 기존 변수의 문제점1 : 변수를 선언하지 않아도 변수?를 사용할수 있다. 기존에는 붙이지 않아도 사용이 가능했다 window로했다 var는 함수 안이 아니면 뭘 해도 window의 속성으로 붙는다. 즉 암묵적 전역변수 양산할 수있다. (2) 문제점2: 변수를 중복해서 선언해도 문제가없다. 의도하지않은 변수값의 변경가능성이 크다. 기존에는 해도 에러가 안났다. 이미 선언한적있다고 ..

I. INTRO : 어제것 어제 boy에게 지령을 내렸다. 우리는 창조적인 작업하고 있음, 움직임! 이는 우리가 넘어갈수없는 세상에 객체를 만들었다 boy라는 입주민이다 입주민은 스스로 혹은 내가 지령받은애가 움직이는 애가있다. 우리는 canvas로 window쓴다. canvas는 입력뿐만 아니라 출력도 해준다. 어제 클릭이라는 입력까지 해봤음 이 외에도 스스로 움직이는 캐릭터가 필요하다. 과거 부터 히스토리 남아있는데, 과거 데이터말고 현재 데이터만 보면된다. 이런거 보면 우리가 화면을 다시 그린다. II. 캐틱터 움직이기 위해서 이전 캐틱터 지우기 1. 들어가며 - 클릭할때 마다 이벤트 발생 일단 우리는 애니메이션처럼 내가 멈춰있던 가던 간에 계속 그리게끔 하는데, 몇 프레임 그리는지를 결정하면된다...

I. INTRO 지금은 언어만 배우는 것이여 게임 구현능력은 부족하지만 구조는 가능함 만들고자 하는것을 생각하고, 게임은 못만들지만 구조는 만들기가능 how? 말하는것으로 지난시간 이미지 그리기로 함수를 이용했음 II. drawImage 이용하기 1. 이미지 이해하기 var img = this.document.querySelector("img"); var img = new Image(); img.src = "./image/boy.png"; img.onload = function(){ ctx.drawImage(img,0,300,105,148.24, 100,300,105,148.24) //위가 이미지, 아래가 캔버스 위치두기 } 위의 경우 img에서 위 4개는 img에 대한 설정이다. 좌측 상단부터 x,y축..

I. INTRO : 프로젝트 관련 목표 코딩연습임 기한내 완수하겠다가 바람직하지 않음, 기한 내 어떻게 만들어지긴 하나 오만가지 쓰레기통이 존재함 자기가만든거 설명도, 오류원인도 모르고 목표를 작게 여러개 (이거하나만 만들더라도 완성도있게) 자랑할만한 작은거 만드는게 코딩습관에 좋은 방향 완성도라 함은 자존심이 높아지는것이다. 앞으로 이론 + 프젝 + 실습 동시에 간다. II. 객체 1 Top -down 설계 (1) 시나리오에서 개체 식별하기 각각 개체가 무엇인지 생각해보기 슈팅게이 : 빌런 / 전투기 (2)객체분석과 개체분석 JS는 클래스가 없어서 개체는 function 객체로 만든다. (3) 캡슐화 시나리오에서 전투기에 행동 체크하기 => 개체마다 역할 정리 시나리오 => 실체객체(개체 객체분석)는 ..

I. INTRO : 지난시간 복습 1) 지난 시간 new안쓰고 하기와 / new 쓰기 new 쓰면 일반함수가 아니라 new한 객체 초기화임 어떤 용도로 할것인지 미리 염두해두고 정의해야한다. 대문자 함수명은 얘는 객체를 생성하고 초기화할때 써야겠다는 의미 이름부터 목적어나 주체(데이터)같은 느낌이다. 2) 문제시 됨 왜? function Exam(){ this.kor = 30; this.eng = 20; this.math = 40; this.total = function(){ return this.kor + this.eng + this.math; } } var exam = new Exam(); console.log(exam.total()); var exam1 = new Exam(); console.log..

I. 자바스크립트 : 함수 1. 함수?? 대입?? 객체?? JS는 함수를 정의 하는 일이 없다. 내가 쓰면서 정의를 한다. int add(int x, int y){ return x + y; } ↑이거를 var add = new Function("x, y", "return x+ y"); 함수객체로서 이렇게 할 수있다. (이 경우 new 'F'unction 으로 해야한다 ) 함수객체 이름은 그냥 var add로 바로 된다. add 호출 시 console.log(add(3,4))로 호출이 가능하다. var add = new Function("x,y", "return x+y;"); console.log(add(3,4)); JS는 정의한다고 하고 쓸 수있다 아래와 같이 var add =function(x,y){ ..

I. INTRO : 시작하며 이때까지 백단으로했고, 이제 프론트 단으로 유용하게 가능하다. II. Wrapper 클래스 지난시간 이어서... 1. 2. Boxing에 사용되는 Wrapper 클래스 이제 자바스크립트로 III. JavaScript [데이터, 컬랙션] 1. 값과 Wrapeer 클래스 (1) JS의 데이터 특징 JS는 넣는 형태가 아님 100% 참조하는 형태이다. 값변수 형식이 없어서 모든것은 객체화 되어있음 참조형식도 언급하지 않는다. 그래서 컴파일러에 의한 오류확인 불가능하고, 실행환경에 의한 오류를 확인할 수 있다. (2) 참조변수의 기본값? 이 경우 참조가 가진 기본값은? 자바는 null / JS 는 undefined이다. JS는 기본형이 wrapper이다. undefine은 타입이다...

I. 서블릿 1.서블릿을 이용한 웹개발 실습 - 출력 (1) 실습 지금 부터는 메모장으로 이용하기 보다 이클립스로 유용하게 이용이 가능하다. 이전시간에는 정적웹이었다면 이번에는 동적인 웹으로 실습해본다. package com.newlecture.web; import java.io.IOException; import java.io.PrintStream; import java.io.PrintWriter; import jakarta.servlet.ServletException; import jakarta.servlet.ServletRequest; import jakarta.servlet.ServletResponse; import jakarta.servlet.http.HttpServlet; public clas..

I. INTRO : 지난 시간 복습 is a 하면은 남의 것 쓰는것에 자유로워진다. 이런것을 하기위한 도구로 서블릿이다. II. 서블릿 1. 웹서버 포트번호 변경하기 (1) 톰캣설치 디렉토리 \conf 폴 톰캣은 서비스 목적뿐만 아니라 개발목적으로도 가능하다. 8080말고 바꾸고 싶을 때! server.xml 을 바꿔준다 (이경우 복사본으로!) 8080 => 80으로 이 경우 web은 80으로서 생략한다. (이경우 80은 보안되지 X) 사서함에서 가져와라 했을 때 사서함 번호(80번)를 알아야한다. 80번은 묵시형 (디폴트 포트)포트이다. 말하지않으면 기본이다. 그래서 생략됨 톰켓은 index.html / index.jsp / index.htm 요구 파일이없으면 404에러가뜬다. nana.txt -> i..