개발 공부중

onchange 이벤트 작성 중 생긴 오류클릭을 해도 반응이 없어서 F12 개발자도구로 확인해보니 아래 오류가 떠있었다 Uncaught TypeError : ~~ is not a function 1.  오타나 겹치는 id, name 이 있는지 확인해봐야한다.input 에 있는 id랑 name를 바꾸고 필요없는 항목 정리하니까 해결됐다.  2. 값을 못 가져온 경우도 뜨게된다.값을 제대로 가져오는지 확인할 것  제외된 항목 숨기기function displayTable() { var table = document.getElementById("myTable"); var rows = table.rows; var arrValues = []; for (var i = 1; i

버튼을 누르면 테이블에 있는 특정값이 들어 있는 한 줄을 숨기는 코드를 작성했는데 value 값을 못 가져오는지 자꾸 전체가 숨겨지는 상황이 생겼다. 해결방법 1. 테이블의 각 행에 있는 'USE_YN' 엘리먼트의 값을 가져와서 arrValues 배열에 저장했다. td에 들어가는 값의 id를 "USE_YN_1" , id="USE_YN_2" 로 다 다른 값을 줬다. 그래서 getElementById('USE_YN_' + i)로 'USE_YN'이라는 id를 가진 엘리먼트를 찾아와서 .value로 해당 엘리먼트의 값을 가져와서 반복문을 통해 모든 행에 대한 값을 배열에 저장했다. 2. '제외' 인 상황과 '제외가 아닌' 상황 두 가지를 처리하기 위해 if - else 문을 사용했다. 아래는 예시 See the..

https://datatables.net/examples/basic_init/zero_configuration.html DataTables example - Zero configuration Zero configuration DataTables has most features enabled by default, so all you need to do to use it with your own tables is to call the construction function: $().DataTable();. Searching, ordering and paging goodness will be immediately added to the table, datatables.net DataTable 사이트 예제로 간..

함수란, 자주쓰는 실행코드를 블록단위로 묶어놓은 것이다. 기능단위로 재사용하기 위해서 사용한다. 함수 선언은 function키워드 사용하거나 arrow function(화살표 함수=>)를 사용한다. 호출 : 정의되어있는 함수는 호출해야 비로서 기능이 실행된다. JavaScript 함수의 종류 선언적함수 : 이름을 붙여서 정의한 함 자바스크립트를 읽을 때 우선적으로 읽어준다. 호출위치가 자유롭다 익명함수 : 이름 없이 정의한 함수 - 콜백함수 - 이벤트 처리시 사용 자체로 호출불가 함수명 대신 변수에 익명함수를 대입하거나 특정이벤트 객체에 대입해서 호출 - 대입형함수 익명 함수의 소스 코드는 변수값이므로 끝에 세미콜론 ; 을 써준다. 일급함수와 고차함수 즉시실행함수 : 함수가 자기자신을 정의하자마자 바로 ..

구조분해할당이란, 자바스크립트에서 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식 let[a,b,c] = [1,2] 처럼 값이 없으면 undefined가 들어간다. let[user1, ,user2] = [’a’,’b’,’c’] 중간에 b값은 무시된다. [a, b] =[b, a] 로 값을 바꿔치기 할 수 있다. let [x, y] = [1, 2]; console.log(x); // 1 console.log(y); // 2 //배열 구조 분해 할당 let users = ['a','b','c']; let [user1, user2, user3] = users; console.log(user1); // 'a' console.log(user2); // 'b' console.log(user..

push() : 뒤에 삽입 pop() : 뒤에 삭제 unshift() : 앞에 삽입 shift() : 앞에 삭제 arr.splice(시작, 개수) : 시작부분부터 개수개까지 요소 지움 arr.splice(시작, 개수, 추가) : 시작부분부터 개수개까지 요소 지우고 추가 arr.slice(n,m) : n부터 m까지 반환 arr.forEach((fn)) : 배열 반복 let arr = ['kim', 'lee', 'park']; arr.forEach((name, index) => { console.log(`${index +1}. ${name}`); }); const array =['사과','배','귤','바나나'] console.log('#for in 반복문') for(const i in array){ con..

얕은 복사는 객체의 참조값(주소)를 복사하고, 깊은 복사는 객체의 값 자체를 복사한다. 얕은 복사(Shallow Copy) const user = { name : "lee", age : 99, } conset user2 = user; user2.name ="kim"; //모두 똑같은 객체를 바라보고 있음 console.log(user); // {name:"kim", age:99} console.log(user2); // {name:"kim", age:99} user를 user1에 넣었더니 기존의 user 값도 같이 변경된 것을 확인 할 수 있다. 데이터 자체를 복사한 것이 아니라 해당 데이터의 참조 값을 전달하여 하나의 데이터를 공유하는 것이다. 깊은 복사(Deep Copy) 얕은 복사처럼 참조 주소값이..

객체(Object)란, 여러 속성을 하나의 변수에 저장할 수 있도록 해주는 데이터 타입 key : value 의 구조로 값을 할당하지 않고 선언만 할 경우 자동적으로 undefined 를 할당 객체가 아닌 기본 데이터 유형, String number boolean null undifined (예제) 접근, 추가, 삭제 및 반복문 사용 const superman = { name : 'clark', // key : value age : 33, } //접근 superman.name //'clark' superman['age'] //33 //추가 superman.gender = 'male'; superman['hairColor'] = 'black'; //삭제 delete superman.hairColor; //..