JS는 이미 html과 연결되어있다. 콘솔창에 document라고 치면 html 속성들을 불러올 수 있음 innerHTML vs innerText element.innerText; 이 속성은 element 안의 text 값들만을 가져옵니다. element.innerHTML; innerText와는 달리 innerHTML은 element 안의 HTML이나 XML을 가져옵니다. element.innerText = "A"; element.innerText에 html을 포함한 문자열을 입력하면, html코드가 문자열 그대로 element안에 포함됩니다. element.innerHTML = "A"; 위와 같이 element.innerHTML 속성에 html코드를 입력하면, html element가 element안에..
const calculator = { add: function (a, b) { console.log(a + b); }, minus: function (a, b) { console.log(a - b); }, multiple: function (a, b) { console.log(a * b); }, divide: function (a, b) { console.log(a / b); }, power: function (a, b) { console.log(a ** b); }, }; calculator.add(10, 5); calculator.minus(10, 5); calculator.multiple(10, 5); calculator.divide(10, 5); calculator.power(10, 5); 위와 같..
Mixed content에러 길찾기 버튼을 클릭 시 모달창으로 감싸서 모달창 안에서 띄워주도록 설정을 함. -> 이 경우 ```` 이란 태그를 사용하게 되는데 코드에서는 HTTPS를 사용하고 있지만 카카오맵 서비스가 자동으로 HTTP로 리다이렉트 되는 경우, 이는 카카오맵 측의 설정또는 동작 방식 때문이다. 따라서 모달창으로 띄워주는 것이 아닌 새창을 띄워지게 만듦으로써 모바일 입장에서는 엘리스랩 찾기 버튼 클릭시 카카오맵 어플을 자동실행시켜주어 길찾기 하도록 해결. 단, 모바일 safari를 이용하게 될 경우 팝업차단 상태로 어플이 실행안될 수 있음 해결방법 설정 열기: 모바일 기기에서 '설정' 앱을 열어주세요. Safari 선택: 설정 메뉴에서 'Safari'를 찾아 선택해주세요. 팝업 차단 해제: ..
데드락(Deadlock) 운영체제에서 데드락(교착상태)이란, 시스템 자원에 대한 요구가 뒤엉킨 상태이다. 즉, 둘 이상의 프로세스가 다른 프로세스가 점유하고 있는 자원을 서로 기다릴 때 무한 대기에 빠지는 상황을 일컫는다. 프로세스1은 자원 A가 필요하다. 자원 A는 프로세스2에 의해 잠겨있다. 프로세스2는 자원 B가 필요하다. 자원 B는 프로세스1에 의해 잠겨있다. 어느 한 프로세스를 강제적으로 종료하지 않으면 컴퓨터가 정지된 것처럼 어떤 작업도 수행할 수 없다. 데드락(Deadlock)의 발생조건 데드락이 발생하기 위해선 아래 4가지 조건이 모두 충족해야 한다. 하나라도 만족하지 않는다면 "절대" 데드락이 발생 하지 않는다. 상호 배제(Mutual exclusion) 한 리소스는 한번에 한 프로세스만..
공유 자원(Shared Resource) 공유자원(shared resource)은 여러 프로세스가 공동으로 이용하는 변수, 메모리, 파일 등을 말한다. 공유자원은 공동으로 이용되기 때문에 누가 어떻게 데이터를 읽거나 쓰느냐에 따라 결과가 달라질 수 있다. (프로세스 : 실행중에 있는 프로그램을 의미) 경쟁 상태(Race Condition) 2개 이상의 프로세스가 공유자원을 병행적으로 읽거나 쓰는 상황, 타이밍이나 순서등이 결과 값에 영향을 줄 수 있다.(동시성 문제) Ex) 프로세스 a와 b가 전역 변수 예금을 읽는다. 둘 다 1000원을 읽었다. 그 후 a가 500원을 더한 후 저장했고, b가 뒤이어 500원을 뺀 후 저장한다. 결과값은 1000원이 저장돼야 하지만, b가 나중에 저장했으므로 500원이..
라이브러리 소프트웨어를 개발할 때 컴퓨터 프로그램이 사용하는 비휘발성 자원의 모임이다. 즉, 특정 기능을 모아둔 코드, 함수들의 집합이며 코드 작성 시 활용 가능한 도구들을 의미한다. 예시 Node.js에서 npm으로 설치한 모듈 HTML의 클라이언트 사이드 조작을 단순화하는 JQuery 웹에서 사용자 인터페이스 개발에 사용되는 React.js Python pip로 설치한 패키지/모듈 (tensorflow, pandas, beautifulsoup 등등) React가 여태 프레임워크라고 생각하고 있었다. 하지만 리액트 홈페이지에서도 그렇고 프레임워크로 분류되지 않고 라이브러리로 분류된다고 한다. 따라서 React.js 웹 서비스 중에서 사용자 인터페이스 개발을 위해 사용되는 라이브러리이다. 프레임워크 원하..
HTTP(HyperText Transfer Protocol) HTTP는 인터넷 상에서 데이터를 주고받는데 사용되는 프로토콜이다. HTTP는 데이터를 평문으로 전송하기 때문에, 데이터를 중간에 가로챌 수 있어 보안에 취약하다. 따라서, 중요한 정보를 주고받을때는 HTTPS를 사용해야 한다. 80번 포트를 사용한다. HTTPS(Hyper Text Transfer Protocol Secure) HTTPS는 HTTP에 데이터 암호화가 추가된 프로토콜이다. HTTPS는 HTTP와 다르게 443번 포트를 사용하며, 네트워크 상에서 중간에 제3자가 정보를 볼 수 없도록 암호화를 지원하고 있다. HTTPS는 SSL(Secure Socket Layer) 또는 TLS(Transport Layer Security) 프로토콜..
event.Target vs event.currentTarget 핵심은 currentTarget은 이벤트 핸들러가 부착된 것을 가리킨다는 것이다 즉, event.target은 부모로부터 이벤트가 위임되어 발생하는 자식의 위치, 내가 클릭한 자식 요소를 반환한다. 하지만 currentTarget은 이벤트가 부착된 자기자신의 위치를 반환한다. Naver 내가 Naver를 클릭했을때 정확히 어떤 것이 반환되는지 알기 위해 콘솔을 찍어두었다. const onLogin = (event) => { console.log(event.target); // Naver console.log(event.currentTarget); // Naver }; 즉, event.target은 자식요소인 span을 리턴하고, event...
- Total
- Today
- Yesterday
- setTimeout
- 브라우저 저장소
- Geolocation
- 깊은복사
- setinterval
- 호이스팅
- 얕은복사
- react
- var
- getCurrentPosition
- 스코프
- removeitem
- Navigator
- Hook
- innerText
- setitem
- const
- Let
- localStorage
- padStart
- classList
- e.preventDefault()
- 데드락
- console.log
- Return
- 교착상태
- useState
- new Date()
- getitem
- createElement
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |