인파

You Can Become A

늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !

공부한 내용을 정리합니다
Language/JavaScript

📚 자바스크립트 배열(Array) 완벽 정복 ❗

자바스크립트 배열 자바스크립트에서 배열은 여러개의 값을 저장하고 관리하는데 사용되는 아주 기본적인 자료구조이다. 자바스크립트 배열은 타입이 고정되어 있지 않아서, 서로 다른 타입의 원소들을 적재할 수가 있다. 그리고 배열은 동적으로 크기가 변할 수 있어 자바(Java)와는 달리 크기를 지정할 필요가 없다. 배열의 생성 자바스크립트에서 배열을 생성하는 방법은 여러가지가 있지만, 주로 대괄호 [] 안에 값을 넣어서 선언하는 문법을 사용한다. // 배열 리터럴을 이용하는 방법 (추천) var arrLit = [1, true, "JavaScript"]; // Array 객체의 생성자를 이용하는 방법 var arrObj = Array(1, true, "JavaScript"); // new 연산자를 이용한 Arra..

category_image
인파_
2021.09.13
(0)
Language/JavaScript

📚 호이스팅(Hoisting) 발생 원리를 알아보자

자바스크립트 호이스팅(Hoisting) 자바스크립트에서 호이스팅(Hoisting)은 변수 선언과 함수 선언을 코드의 맨 위로 끌어올려지는 현상을 일컫는다. 그래서 개발자가 어느 라인 위치에 코드를 선언해도, 실행 되기전 코드가 최상단으로 끌어올려지고 실행되게 된다. 이러한 호이스팅이 발생하는 원인은 자바스크립트의 변수 생성(Instantiation)과 초기화(Initialization)의 작업이 분리돼서 진행되기 때문이다. console.log(a()); // 'a' console.log(b()); // Uncaught TypeError: b is not a function console.log(c()); // Uncaught TypeError: b is not a function function a()..

category_image
인파_
2021.09.13
(0)
Language/JavaScript

📚 var / let / const 차이점 정리 (변수 호이스팅)

자바스크립트 var / let / const 차이점 5가지 중복 선언 가능 여부 재할당 가능 여부 변수 스코프 유효범위 변수 호이스팅 방식 전역객체 프로퍼티 여부 1. 중복 선언 가능 여부 var : 중복해서 선언(+초기화)가 가능하다. 이 경우, 마지막에 할당된 값이 변수에 저장된다. 기존에 선언해둔 변수의 존재를 까먹고, 값을 재할당하게 되는 등의 실수가 발생하기 쉽다. ​ const, let : 중복 선언 불가능 이미 선언한 변수를 다시 선언할 경우, 에러가 발생한다. var에 비해서 코드의 안정성을 높여줄 수 있는 방식으로, 다른 언어를 쓰던 사람들게도 익숙할 것이다. 2. 재할당 가능 여부 var, let : 값의 재할당이 가능한 변수다. 변수 선언 및 초기화 이후에 반복해서 다른 값을 재할당 ..

category_image
인파_
2021.09.12
(0)
Server/Tomcat

[TOMCAT] 🐱 아파치 톰캣 개념 구성 & 설정 💯 정리

아파치 (Apache) 와 톰캣 (Tomcat) 아파치 (Apache) 아파치 소프트웨어 재단에서 만든 웹서버(web server)를 일컫는다. 리눅스에서는 httpd 로 명명지어져 배포된다. 정적인 데이터들 (html, css 이미지, 파일 등)에 대한 클라이언트의 요청을 데이터로 만들어서 응답한다. 80 포트를 사용 Web Server 란? http 프로토콜 기반으로 web client (browser) 로부터의 요청을 서비스하는 기능을 담당하는 프로그램. 80번 포트로 클라이언트 요청(POST,GET,DELETE)이 왔을때만 응답한다. 정적인 데이터에 대한 처리를 담당한다. 톰캣 (Tomcat) 웹 서버와 웹 컨테이너의 결합 (컨테이너, 웹 컨테이너, 서블릿 컨테이너라고 부름) 현재 가장 일반적이고..

category_image
인파_
2021.09.12
(0)
Language/JavaScript

[JS] 📚 자바스크립트의 Getter & Setter 완벽 정리

프로그래밍 Getter & Setter 개념 Getter와 Setter는 객체 지향 프로그래밍에서 사용되는 개념이며, 일조의 메서드라고 보면 된다. 즉, 단어 그대로 Getter는 객체의 속성(property) 값을 반환하는 메서드이며, Setter는 객체의 속성 값을 설정, 변경하는 메서드라고 보면 된다. 예를들어 user 라는 객체가 있을 경우, 보통이라면 user.name 으로 프로퍼티로 바로 접근해서 이름값을 가져오거나 재설정할텐데, const user = { name: 'inpa', age: 50 } console.log(user.name); // inpa user.name = 'tistory'; 위와 같이 바로 접근하지 말고, getName(), setName() 메서드를 통해 경유해서 설정하..

category_image
인파_
2021.09.10
(0)
Language/JavaScript (WEB)

🌐 브라우저 & 윈도우 화면 - 높이/너비 구하기

클라이언트(브라우저) 높이/너비 구하기 표준이 아닌 방법들로 해보니 브라우저 환경에 따라 인식이 이상하게 되는 경우가 발생했다. 제일 확실한 방법은 screen 객체를 활용하거나 HTML5 표준을 따르는 방법인 것 같다. body객체로 구하기 (HTML 표준 X) // 실제 사용하는 브라우저의 안쪽 너비 document.body.offsetWidth document.body.scrollWidth document.body.clientWidth // 실제 사용하는 브라우저의 안쪽 높이 document.body.offsetHeight document.body.scrollHeight document.body.clientHeight HTML5 표준 window.screenTop //: 상단으로부터 브라우저 위치 ..

category_image
인파_
2021.09.10
(0)
Language/JavaScript (WEB)

🌐 window.open (새창 열기/닫기) 사용법 💯 정리

window.open (새창 열기) 웹브라우저에서 새창(팝업창)을 열기 위해서 가장 간단히 사용할 수 있는 방법이 바로 자바스크립트 window 객체의 open() 함수를 사용하는 것이다. var popup = window.open('팝업주소', '팝업창 이름', '팝업창 설정'); 다음은 팝업 클릭시 네이버창 팝업 띄우는 예제이다. See the Pen window.open by barzz12 (@inpaSkyrim) on CodePen. ​window.open 인수 정리 var popup = window.open(url, name, option); url 새창(팝업창)에 보여질 주소 다. 선택적인 값으로 비워두면 빈창(about:blank)이 보이게 된다. name 새로 열릴 창의 속성 또는 창의 이..

category_image
인파_
2021.09.10
(0)
Language/JavaScript (WEB)

🌐 window.onload() 를 사용하는 이유

HTML 실행 위치에 따른 오작동 HTML 문서는 객체 태그들을 위에서부터 아래로 차례차례 읽어 들인다. 그런데 이러한 특성으로 인해 가끔 자바스크립트의 작성 위치에 따라 오작동을 일으키기도 한다. 예를들어 아래 코드와 같이 hello 이러한 까닭은 HTML은 실행 이전에 에러 체크를 하지 않고 실행을 하는 인터프리터 언어적 특성으로 인해, 자바스크립트의 document.getElementById('name') 가 html 내부 id가 name이란 태그가 생성되기도 전에 실행되므로 요소를 가져올 수가 없어 문제가 일어나는 것이다. 그러므로 아래 와 같이 자바스크립트 태그를 문서의 뒤로 옮겨야만 하는데, 문제가 해결되기는 하지만 html 문서가 길어진다면, 내가 만든 자바스크립트가 아래쪽에 놓여있다면 휠을..

category_image
인파_
2021.09.10
(0)
개발 지식/WEB 지식

🌐 인터넷 네트워크 통신 기초 (IP / TCP / UDP / PORT / DNS)

인터넷 통신은 어떻게 이루어지는가 클라이언트에서 다른 클라이언트(컴퓨터)로 데이터를 보낼경우 위치에 따라 위성, 해저광케이블, 기타 통신서버와 같은 인터넷망을 거쳐서 상대 컴퓨터에 도달하게 된다. 그런데 인터넷 망은 단순하지 않아, 아래 그림과 같이 수 많은 중간 노드를 거쳐서 서버 컴퓨터에게 도착한다. 이렇게 웹 통신 과정이 어떤 규칙으로 목적지까지 안전하게 도착하는지의 이해를 하기 위해 이제부터 배울 IP, UCP, DNS 프로토콜 지식들을 알아야 한다. [ 노드 ] 네트워크를 중간에서 연결해주는 서버라고 보면 된다. 네트워크의 기본요소인 지역 네트워크에 연결된 컴퓨터와 그 안에 속한 장비들을 통틀어 하나의 노드라고 부르며, 재분배 지점 또는 통신 종단점이다. IP (인터넷 프로토콜) [WEB] 🌐 ..

category_image
인파_
2021.09.06
(0)