저번에 뒤로가기를 구현했을 때 stack 구조를 이용하여 구현하였습니다. 이번에는 탭을 끄고 난뒤 탭이 닫혀있으면 rule에 의하여 닫힌 탭은 content 부분에서 사라지고 나머지 탭이 보여지는 기능을 만들어 보고자 합니다. - 우선 linkedList 를 이용하면 될꺼라 생각해서 시도해 보았으나, 코드가 복잡해지고 구현이 안되었습니다. 이번 포스트는 원인분석과 과정을 써보았습니다. 다음 포스트에는 다른방법으로 시도해 볼 것입니다. 1] 기본적인 linklist 구조 class Node { constructor(data, next = null) { //data와 next를 넣고 next의 디폴트는 null로 지정 왜냐하면 linkedlist의 tail(마지막은) null로 끝나기때문 this.data ..

목표] 메뉴 1, 메뉴 2를 선택하면 바로 아래부분에 a태그와 button을 가진 template이 추가되며 글로벌 변수에 open인지 close인지 상태를 저장한다. 메뉴의 종류에 따라 contents부분이 해당 jsp파일의 내용으로 교체된다. 히스토리 로드를 클릭하면 (뒤로가기) 이전에 객체형태로 저장한 content를 보여준다. 자료구조는 stack을 사용하였고, 뒤로갈 페이지가 없을시 해당 alert를 호출한다. 코드분석] 1] 메뉴 1, 2클릭 구현 각각 onclick 함수로 오프너 함수와 checktab 함수에 각각 메뉴인자를 전달. 2] menuopener함수 JQuery의 load 함수를 이용해서 content가 있는 부분인 의 id인 menucontent 부분을 해당 requestMapp..

$Load() 함수 : Ajax 와 같은 통신을 통해 서버로부터 데이터를 불러와 선택된 요소에 넣는 jQuery 입니다. 문법 : $(선택자).load(URL, data, callback 함수); url : 불러올 주소 data : 요청에 사용할 데이터 callback 함수 : 요청에 대한 응답을 처리할 콜백함수 url 에서 #를 이용해 불러온 문서에서 해당 tagid를 가진 부분만 선택적으로 불러올 수도 있습니다. 버튼 2에클릭시 함수를 달고 그 안에 load를 사용하였습니다. #content로 content 라는 아이디를 가지는 div를 대상으로 불러올 것입니다. 불러올 파일은 tabmanager 아래의 tab2.viw.jsp 입니다. load 뒤에 url 부분에 바로 상대경로던 절대경로던 바로 ur..

1] for each for each는 반복문이 아니라 함수이다. 즉 array 타입 앞에 바로 붙여서 사용 가능하다. for each는 break가 없는 단점이 있다. 간단하고 빠르게 사용가능하다. 2] for in for (variable in object) { ... } obj의 key 값을 이용하여 반복합니다 for...in은 인덱스의 순서가 중요한 Array에서 반복을 위해 사용할 수 없습니다. 위와 같이 object의 프로토타입도 같이 호출이 되는 단점이 있어 잘 사용하지 않는다. 3] for of for (variable of iterable) { statement } for...of 명령문은 반복가능한 객체 (Array, Map, Set, String, TypedArray, argument..

문법 :Object.assign(target, ... sources) 해당 메소드는 타켓 파라미터와, 기타 병합 할 객체를 받습니다. 그리고 리턴값으로는 target object를 반환합니다. 이전 JQuery에서 extends와 유사하게 target이 되는 객체에 새 덧붙여 return 하기 때문에 원본을 해치지 않으려면 빈 {} 객체를 target으로 두고 해당 객체를 받아오면 됩니다. 위의 코드에서 copy1과 copy2는 똑같이 나옵니다. 왜냐하면 copy 와 copy2에 저장된 요소는 a 객체이고 a 객체는 assign에 의해 c까지 합쳐진 상태가 되었기 때문입니다. 이렇게 사용하던 객체를 이용하면 마지막에 합쳐진 결과값으로 나오기 때문에 원본의 훼손이 일어나지 않게 하려면 빈 {}를 targe..

1] 현재 날짜, 시간 구하기. 변수를 선언하고 그 값에 querySelector로 편하게 객체에 접근한다. 새로운 변수를 각각 선언하고 그 값을 new 생성자를 통해 Date 함수를 통해 각각 값을 지정한다 getFullYear의 값은 4자리 수를 반환 (number) getMonth의 값은 2자리 수를 반환 (number) 아래의 컨트롤러 함수를 따로 지정해서 컨트롤 하였다 index 를 받아서 처리한다. new Date()안에 각각의 파라미터를 넣어주게 되면 해당 년, 월, 일 에 맞춰서 나오는데 2021년 12월 0일은 없다. 이 값은 해당 월의 마지막날을 알려주게 된다. 만약 그 달의 마지막날로부터 1일 전이라면 -1 이런식으로 변경해서 사용 할 수도 있다. substring 과 비슷한건 sub..