전체 글(175)
-
[프론트엔드]_JavaScript(es6)_5. Object
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js 1.Object 오브젝트란 저번에 말한 것처럼 틀이 정해져 있다면 그안에 값을 지정해서 메모리에 올라가 동작하는 것을 말한다. {} 안에 직접 지정하는 object literal 문법이 있고 생성자를 이용해서 만드는 object constructor 문법이 있다. 이처럼 yoon 이라는 object를 {}를 사용하여 생성하고 이를 Function 의 파라미터로 전달 할 수 있다. 자바스크립트는 동적으로 (Runtime) 동작하는 언어인데. 뒤늦게 하나의 property를 추가 할 수 있다. 이렇게 생성하고 지울 수 있지만 필드에서 유지보수를 할 때 힘들고 오류발생을 야기한다. 이 개념에서 가장 중요한 것은 O..
2021.11.27 -
[프론트엔드]_JavaScript(es6)_4. Class
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js 클래스란 무엇인가? 클래스는 모양이 정해진 틀과 같다. 붕어빵 틀 혹은 청사진이라고도 부를 수 있다. 데이터가 들어가 있지 않고 한번만 선언된다. 메모리에 올라가지 않는다. 오브젝트란? 클래스에서 틀을 만들었다면 값 (붕어빵에서는 팥붕어빵, 슈크림 붕어빵) 과 같이 테이타를 넣어서 instance를 생성했을 때 Object가 된다. 데이터가 들어가 있고, 여러번 선언될 수 있다. 또한 메모리에 올라가게 된다. JS에서는 es6 전까지는 class 라는게 정의되어 있지 않고 object로 만들었었다. 클래스는 prototype-based 로 만들어진 것이며 의미는 같다. 1. 기본 형식 위에서 Person 이라..
2021.11.27 -
[초보개발자]_JSP 메모장 2번
1. Intellij 와 SVN 1단계 intellij와 VSN 둘다 처음 쓰다보니 햇갈려서 적어봅니다. GIT과 유사하게 update 선 commit을 해야하고 해당 파일 혹은 directory 에서 마우스 우클릭 -> subversion 항목으로 들어간다. history 항목으로 들어가서 어느 값이 변경되었는지 확인할 수 있다. 이는 충돌이 났을때 (파일이 빨간색) 일때 사용하면 된다. 파일 색으로 추측이 가능하다. 대표적으로 파란색은 서버에 올라가있는 파일과 차이점이 있을때 나타나고 빨간색은 merge 충돌이 났거나 오류가 발생했을 때 회색은 삭제할 예정일 때 발생한다. 자세한 색은 다음과 같다 : https://www.jetbrains.com/help/idea/file-status-highligh..
2021.11.26 -
[초보개발자]_JSP 메모장 1번
1. Form태그 -> bootstrap 에서 제공하는 형태이다. 즉 action이 달려있는 의미 그중 submit은 페이지 이동이 강제로 일어난다. SPA 에서는 필요가 없기 때문에 버튼으로 수정하고 Form 태그를 지워줘야 Enter 입력시 tab이 닫히는 현상을 막을 수 있다. form은 전달 형식중 한가지이며 post와 get 방식이 나눠져있다. 2. 함수 선언은 굳이 한번 쓴다면 밖에 할 필요는 없다. -> 이는 메모리 참조로 이어진다. 또한 변수 선언을 let으로 해줘야한다 let으로 선언하지 않을때는 var로 선언되는데 이는 hoisting되어 다른 오류를 발생시킬 수 있다. 3. 그리드 페이지 검색기능 개발 onchange 와 onkeyup을 이용하여 구현 onchange는 안의 값이 변경..
2021.11.25 -
[프론트엔드]_JavaScript(es6)_3. Function
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js 함수 하나의 함수는 한가지의 일만 하도록 만들어야 효과가 좋다. 함수의 이름은 무엇인가 동작하는 것 으로 만들어야한다 => 동사 자바스크립트에서의 함수 func = object 이다. 변수에 할당 할 수도 있고 파라미터로 전달 할 수도 있다. 문법 function printHello(){ console.log('hello'); } printHello(); function log(message){ console.log(message); } log('hello@'); log(1234); 파라미터 값에 의한 전달 (Passed by value) Premitive 파라미터 : value 가 전달 [원시 타입] : B..
2021.11.21 -
[프론트엔드]_JavaScript(es6)_2. operator, if, for loop
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js String 연산 Js에서도 + 사용 가능. 연산자 console.log(2**3); // 2의 3승 ++/-- 순서 다른 언어와 같다. 증감 연산자 x += y; // x = x + y x -= y // x = x - y 논리 연산자 || 와 && 를 사용한다. 여기서 코드적으로 중요한 부분은 || 의 경우 앞에서부터 검사하게 되는데 앞이 true가 나와버리면 어차피 전체 결과는 true로 반환된다. 즉 뒤의 2가지 검사는 하지 않고 반환하기 때문에 시간적으로 걸리는( 함수 등..) 을 앞에 넣어버리는 것 보다 빠르게 결과가 나오는 것을 앞에 두는 것이 효율적인 코드라고 할 수 있다. &&도 마찬가지로 한가..
2021.11.21 -
[프론트엔드]_JavaScript(es6)_1. Variable
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js 변수 선언 어플리케이션 마다 쓸 수 있는 메모리는 정해져 있다. let 이라고 정의하게 되면 한가지의 포인터가 생긴다. 이는 내용을 참조하여 변경이 가능하다. Var 변수 선언 es6 이후 var는 사용하지 않는다. 대부분의 프로그램 언어는 선언 후 값을 할당하는데 var의 경우에는 선언하지 않고도 사용이 가능하다. 즉 Hoisting이 된다. hoisting은 어디에 선언했는지 상관 없이 제일 위로 끌어올려주는 것을 말한다. 또한 block Scope 도 무시한다. 즉 어디에서나 접근이 가능하다 규모가 큰 프로젝트에서는 의도하지 않은 호출이 될 수 있기 때문에 최대한 사용을 줄인다. Mutable 과 Imm..
2021.11.21