새벽코딩

UI 만드는 스텝 1. HTML/CSS로 미리 디자인 2. 필요할 때 보여질수 있도록, 자바스크립트로 구현 먼저, 스타일링을 위해서 따로 main.css 라는 파일을 만들어주고, css파일을 아래와 같이 UI 만드는 스텝에 따라서 먼저, 스텝1. tag를 이용해서, alert 박스를 하나 만들고 styling시 display를 'none'으로 안보이도록 설정한다. 코드 : index.html alert1 button // 이 부분에 동작을 위한 자바스크립트 코드 추가 예정 코드 for styling : main.css .alert-box { background-color : skyblue; padding : 20px; color : white; border-radius: 5px; /* 해당 tag를 숨기..

- 자바스크립트 사용 목적? HTML을 조작하기 위해서 사용한다. - WHY? 1 HTML안의 텍스트, 스타일링을 할 수 있다. 2 Tab, Modal등 UI를 만들 수 있다. 3 버튼클릭시 서버로 데이터 요청 할 수 있다. 예시) 어떤식으로 자바스크립트를 사용할까? Hi 위 HTML의 tag안에, 출처 : 코딩애플 'JavaScript 입문과 웹 UI개발'

- Overloading (오버로딩) - 파이썬 미지원 : 같은 메서드명으로 매개변수와 데이터타입, 순서에 따라서 다른 메소드가 호출되는 것 #Java 오버로딩 예제 코드 add(int x, int y){ return x + y; } add(int x, int y, int z){ return x + y + z; } - Overriding (오버라이딩) - 파이썬 지원 : 상속관계, 같은 메서드명, 매개변수도 동일, 개수도 동일 (메서드의 선언부 동일) 그것을 구현부만 다르게 한다. (modify) class Book: def _init__(self, title, author, pages): self.title = title self.author = author self.pages = pages def _..

1) Instance variable (인스턴스 변수) class Car : name = "" speed = 0 위 class에 있는 변수 name과 speed는 인스턴스 변수이다. 인스턴스 변수는 인스턴스를 생성해야 사용할 수 있는 변수이다. (즉 아직 실제 공간이 할당되지 않음) 이제 이 설계도 (class)를 이요해 메인 코드 부분에서 자동차 (instance)를 만든다. car1 = Car() car2 = Car() 이제 car1과 car2 는 실제 존재한느 자동차이며, 이 안에는 color와 speed의 메모리에 공간이 만들어 졌다. ** 결론 : 인스턴스 변수는 메모리의 독립적인 공간을 가지고 있으며, 반드시 인스턴스를 생성해야지 사용할 수 있다. 2) class variable (클래스 변수..

1) 생성자의 개념 - 생성자(Constructor)는 인스턴스를 생성하면 무조건 호출되는 메서드 이다. - 인스턴스를 생성하면서, 필드값을 초기화 하는 역할을 하는 메서드 이기도 하다. class Car: color = "" speed = 0 def upSpeed(self, value): self.speed += value def downSpeed(self, value): self.speed -= value def printFields(self, myCar): print("%s의 색상 : %s, 속도 : %dkm" % (myCar, self.color, self.speed)) if __name__ =="__main__": myCar1 = Car() myCar2 = Car() myCar3 = Car() ..

1) Car 클래스 정의 class Car: color = "" speed = 0 def upSpeed(self, value): self.speed += value def downSpeed(self, value): self.speed -= value (위 코드는 run 해도 아무것도 출력 되지 않는다. 단지, Car 클래스의 설계도이다. (== 붕어빵 틀) ) 먼저 self 에 대해서 알아보자 (java 에서 this와 동일) self는 클래스 자기 자신의 주소를 가지고 있는데, self.speed 는 speed 를 의미한다. 즉, 자신의 클래스에 있는 speed 맴버변수(필드) 라고 해석하면 된다. self는 객체를 생성해야 활성화된다. class 에는 메서드나 멤버변수(필드)는 얼마든지 추가, 삭제 ..

Input 태그는 사용자가 입력을 할 수 있는 태그이다. 아래와 같이 여러 종류의 input이 존재한다. - input에 뭔가 입력시 코드를 실행하려면, onChange 또는 onInput 과 같은 event handler를 사용한다. { 실행할코드 }}/> 그 외에, onMouseOver = { }# 이 요소에 마우스를 댔을 때 안의 코드 실행 onScroll = { } # 이 요소를 스크롤했을 때 안의 코드를 실행 등등 많이 존재한다. - input에 입력한 값 가져오는 방법 { console.log(e.target.value) }}/> onChange 안에 함수에 파라미터로 e를 추가해주고, e.target.value라고 적으면 현재 에 입력된 값을 가져올 수 있습니다. 참고로 e.target 이러..

똑같은 html 이 반복적으로 출현하면, 반복문을 이용해서 코드를 간단하게 만들 수 있다. 단, 흔히 사용하는 for 반복문은 JSX 중괄호 안에서 사용할 수 없어서 map() 함수를 대신 사용한다. -. 자바스크립트 map 함수 쓰는법 모든 array 자료 우측에 map() 함수를 붙일 수 있다. 1) array 자료 갯수만큼 함수안의 코드를 실행해준다. [1,2,3].map(function(){ console.log(1) }) 위에 array에는 3개의 자료가 들어있다. (1, 2, 3) 그래서 console.log(1) 에 의해서, 1이 세번 출력이 된다. 2) 함수의 파라미터는 array안에 있던 자료를 하나씩 불러온다. [1,2,3].map(function(element){ console.log..