런타임노트

1. window.onload 1) 호출 시점 - 페이지의 모든 요소들이 로드된 이후에 호출 2) 특징 - 페이지의 모든 요소들이 로드되어야 호출된다. - 한 페이지에서 하나의 window.onload()함수만 적용된다. - 가장 나중에 호출된 함수만 적용 2. $(document).ready() 1) 호출 시점 - DOM이 로드된 시점 2) 특징 - 외부 리소스 및 이미지 로딩과 상관없이 DOM만 로드되면 바로 실행된다. - 중복 사용해도 순서대로 모두 실행된다.

전문직 주부 // value는 value값 function changeJob() { var jobSelect = document.getElementById("job"); var selectedJob = jobSelect.options[jobSelect.selectedIndex].value; // 1 } // text는 text값 function changeJob() { var jobSelect = document.getElementById("job"); var selectedJob = jobSelect.options[jobSelect.selectedIndex].text; // 전문직 }

let과 var은 JavaScript에서 변수를 선언하는 데 사용되는 두 가지 키워드 두 키워드는 스코프 및 호이스팅과 관련하여 중요한 차이가 있습니다. 스코프: var는 함수 스코프를 가지고 있습니다. 즉, 변수가 선언된 함수 내에서만 유효하며 함수 외부에서는 접근할 수 없습니다. let은 블록 스코프를 가지고 있습니다. 블록 내에서 선언된 변수는 블록 내에서만 유효하며 블록 외부에서는 접근할 수 없습니다. function example() { if (true) { var x = 5; // 함수 스코프 let y = 10; // 블록 스코프 } console.log(x); // 5 console.log(y); // ReferenceError: y is not defined } 2. 호이스팅: var는 ..

출처 : https://semicolon-dev.tistory.com/48 원하는 개발 방향 1. 테이블에 모든 줄에 저장 버튼이 있음 2. 저장 버튼을 눌렀을 때 해당 줄에 있는 값을 jQuery 상에서 불러와야 함 우선 해당 개발 방향대로 개발을 진행하기 위해 아래와같은 테이블을 작성하였습니다. 주소 설명 저장버튼 저장 저장 저장 $('.saveBtn').on('click', function() { //현재 row의 정보 가져오기 var thisRow = $(this).closest('tr'); //주소 input 값 가져오기 var addr = thisRow.find('td:eq(0)').find('input').val(); //섦졍 input 값 가져오기 var txt = thisRow.find(..

forEach() MDN참조 주어진 함수를 배열 요소 각각에 대해 실행함. array1.forEach(element => console.log(element)); // expected output: "a" // expected output: "b" // expected output: "c" for 반복문을 forEach()로 바꿀 수 있다 const items = [ 'item1', 'item2', 'item3' ]; const copy = []; // 반복문 for (let i =0; i { if (Array.isArray(i)) { result.push(...flatten(i)) } else { result.push(i) } }) return result } // Usage const nested =..

Javascript에서 문자열 줄 바꿈하는 2가지 방법! escape 문자 사용하기 템플릿 리터럴(Template literals) 사용하기 1. escape 문자 사용하기 문자열에 New Line을 뜻하는 '\n' 이스케이프 문자를 넣어주면 줄바꿈됩니다. const str = 'a\nb\nc\n'; document.getElementById("result").innerHTML=str; 2. 템플릿 리터럴(Template literals) 사용하기 const str =`a b c`; document.getElementById("result").innerHTML=str; 문자열 안에 escape문자인 '\n'을 사용하면, 가독성이 떨어지는 단점이 있습니다. 문자열을 정의할 때 따옴표( ' 또는 " )를 사..

splice 함수를 사용한다. array.splice(start, deleteCount [, item1 [, item2 [, ...] ] ]) start : 기준이 되는 배열의 index deleteCount : splice 함수는 배열 중간에 값을 삭제할 때도 사용한다. 값을 삭제할 때는 start에 설정한 index로 부터 몇 개의 요소를 제거할지 지정한다. 값을 추가하는 경우에는 ‘0’으로 설정. item : 설정할 값

true && expression 항상 expression false && expression 항상 false 따라서 && 뒤의 element는 조건이 true일 때 출력된다. 조건이 false라면 react는 무시하고 건너 뜀. 출처 https://ko.reactjs.org/docs/conditional-rendering.html 조건부 렌더링 – React A JavaScript library for building user interfaces ko.reactjs.org

나는 리액트에서 렌더링 이야기만 나오면 지레 겁을 먹는다. 가장 어려운 부분이기 때문이다. [상황] 부모 - 자식 컴포넌트가 있으면 부모에서 버튼 클릭 시, 자식 컴포넌트가 바뀌어야 한다. 그런데 렌더링이 안되고 자식 컴포넌트가 바로 바뀌지 않음. 우리는 렌더링이 필요한 상황! 그런데 구글링 해보면 다 렌더링을 막는 글들 뿐이었다. 해결한 방법은 쉬운 방법. [해결] 보여줄 값이 바뀌었다는걸 자식 컴포넌트가 알 수 있도록 "값이 바뀜"을 state로 관리한다. // 부모가 자식에게 우리 변했어! 라고 알려줄 힌트 const [initPage, setInitPage] = useState(false); useLayoutEffect(() => { setInitPage(true); }); if(수정이 성공하면)..