코딩 새 출발

❗❗file 타입의 input 태그는 readOnly 속성이기 때문에 속성에 사용자가 임으로 값을 넣을 수가 없습니다 그래서 value 값을 지울 수가 없다 file 타입의 input태그의 value를 지우려면 지웠다가 똑같은 애 를 만들어서 대체해주는 방법을 사용한다 그때 사용하는게 .cloneNode() 이라는 메서드가 있다 이 메소드를 이용해서 input 태그의 clone를 만들어주고 원래 가지고 있던 input 태그를 지우고 clone로 복사해둔 파일로 바꿔 치는 것이다 이렇게 해주면 input 태그의 value 값을 초기화해줄 수 있다

⭐UUID 네트워크 상에서 고유성이 보장되는 id를 만들기 위한 표준 규약 주로 분산 컴퓨팅 환경에서 사용되는 식별자이다. 중앙관리시스템이 있는 환경이라면 각 세션에 일련번호를 부여해줌으로써 유일성을 보장할 수 있겠지만 중앙에서 관리되지 않는 분산 환경이라면 개별 시스템이 id를 발급하더라도 유일성이 보장되어야만 할 것이다. 이를 위해 탄생한 것이 범용 고유식별자 UUID (Universally Unique IDentifier)이다. UUID는 128비트의 숫자이며, 32자리의 16진수로 표현된다. 여기에 8-4-4-4-12 글자마다 하이픈을 집어넣어 5개의 그룹으로 구분한다.

HTTPS Htper Text Transfer Protocol Secure 😎기존의 HTTP 사이트보다 안전하다는 뜻 안전하다는 건? 사용자가 웹사이트에 보내는 정보를 다른 누군가 훔쳐보지 못하게 한다 사용자가 접속한 사이트가 진짜인지 가짜인지 판별해 준다 어떤 원리인지를 알려면 대칭키 비대칭키 를 알아야 한다 대칭키 기존에 많이 사용되던 방식 메시지를 보내는 쪽과 메시지를 받는 쪽이 메시지를 암호화하고, 이를 다시 메시지로 바꾸는 즉 복호화 하는 같은 방식을 공유한다 상대방에게 보낼 때 메시지와 “키” 를 같이 알고리즘에 넣어서 암호화한 다음 보내고 받는 사람은 “키”값을 알아야 하고 그 “키”값으로 알고리즘을 거꾸로 돌려서 해독한다 이 과정을 복호화라고 함 서로 키를 가지려면 한 번은 키를 건네줘야 ..

😎아하 이런 거였어? spring의 트랜잭션을 이해하면서 가장 헷갈렸던 부분은 DB를 공부할 때 나왔던 트랜잭션의 의미 (한 가지에서 동시에 여러 일들이 일어나는 경우)로 이해하고 있었는데 spring의 트랜잭션에서는 여러 가지 기능을 하나로 묶어준다는 개념처럼 느껴져서 굉장히 혼란스러웠다 하지만 아 다르고 어 다른 결국은 같은 의미라는 걸 알게 되었다 하나의 파라미터를 이용해서 동시에 여러 기능들을 처리하는 경우 그리고 여러 가지 기능은 한 가지의 파라미터를 가지고 있다 이 둘은 결국은 같은 이야기이다 하지만 어떤 방식으로 접근해서 이해하는지에 따라 헷갈릴 수도 있을 것 같다 이걸 이해하면서 강사님이 말씀해 주신 한 가지가 처음에는 무슨 소리야.. 했지만 이해하고 보니 정말 주제를 관통하는 말이었다

⭐⭐호이스팅⭐⭐ 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것 var 변수 선언과 함수선언문에서만 호이스팅이 일어난다. var 변수/함수의 선언만 위로 끌어 올려지며, 할당은 끌어 올려지지 않는다. let/const 변수 선언과 함수표현식에서는 호이스팅이 발생하지 않는다.

JavaScript 프로토타입 ⭐원형 메모리를 공유하는 모양 메모리를 아껴서 쓸 수 있다는 장점이 있다 B가 A를 바꿔버리면 다른 B가 보는 A의 데이터도 변해버린다 객체 리터럴은 프로토 타입이 없다 Array.prototype.push() 배열 자체를 반환을 못해준다 카운트 값만 반환 push const arr = [1,2,3] console.log(arr.push(4)) console.log(arr.push([5,6])) console.log("--------------") console.log(arr) 결과 Array.prototype.concat() 기존 배열을 변경하지 않습니다. 추가된 새로운 배열을 반환합니다. concat 은 새로 만드는 방식이라 별도의 변수를 잡아줘야 한다 console.l..

이벤트 Sample AAA Sample2 AAA2 지금 사용하는 방법이 가장 많이 사용되는 패턴이다 ul : 원래 있었던 것 그래서 이벤트를 ul에 걸어준다 li : 동적으로 생성 화면 지금 이벤트는 ul 에 걸었는데 버블링 때문에 button에 이벤트가 걸린다 그래서 동적인 li태그가 아닌 고정된 ul에 걸어준다 ul 태그의 범위 현재 ul 태그의 범위가 이렇게 설정되어있어서 사실 button 아 아닌 다른 곳을 눌러도 이벤트가 발생한다 그래서 button 에만 이벤트를 발생시키는 코드를 만들어 보려 한다 코드 작성 Sample AAA Sample2 AAA2 화면 이 방법이면 밖에 있는 ul만 걸어주면 이벤트를 손쉽게 사용할 수 있다 click 한 button의 div 가 어디 있는지 찾아보고 싶다면?..

⭐ 너도? Outer Inner inner를 태그로 만들어 주었다 화면에서 보기 Inner을 클릭하면? aaa로 가려고 한다 ❗ 멈춰!!! event.preventDefault() Outer Inner event.preventDefault()를 사용하면 태그의 기능을 막는다 화면에서 보기 Inner을 눌러도 가 반응하지 않는다 ❗❗여기서 의문 아니 를 안 쓰면 되지 왜 이렇게 복잡한 방법을 쓰는 거야???? 😉그 이유는 바로 Bootstrap에서 Pagination 같은걸 사용하면 그 안에 가 있는데 그걸 빼면 스타일 같은 게 깨질 때가 있다 이럴 때 사용한다 ⭐너는 어디서 왔니? event 가 어디서 걸렸는지 확인하려면 어떻게 해야 할까? console.log(event.target) 화면 event...

Outer Inner 코드의 구조 클릭을 하면 어떤 게 먼저 작동할까?? inner → outer outer → inner 대부분의 브라우저는 1번으로 작동한다 1번처럼 안쪽에서 밖으로 가는 것을 버블링이라고 한다 반대로 2번 의 경우처름 밖에서 안쪽으로 가는 것을 캡쳐링 이라 한다 화면에서 보기 화면에서 Inner을 누르면 console에서는 버블링으로 작동한다 😉정리 버블링 : 먼저 이벤트가 발생한 곳이 동작하고 밖으로 올라간다 캡쳐링 : 밖에서부터 이벤트가 동작한다 😉,false 는 무엇일까? Outer Inner ,false 가 붙으면 캡쳐링을 안 하고 버블링 방식만 쓰겠다는 선언!!! 대부분의 브라우저는 버블링을 방식이지만 안전하게 코드를 짜기 위해 선언해준다 ⭐stopPropagation() ..

우선 JavaScript 에서는 → 객체(node , element)로 본다 ⭐객체의 하위를 검색하는 selector 문법 Java JavaScript ⭐⭐하위에서 상위를 찾고자 하는 경우 실제로 코딩을 할때 정말 많이 사용된다고 한다 1st 2nd 3rd querySelector 가 밖에서 안으로 찾아서 들어가는 문법이라면 closest는 안에서 밖으로 찾아가는 문법 ⭐자신과 동일한 위치의 이전&다음을 찾는 문법 1st 2nd 3rd