프론트엔드/JavaScript(5)
-
서버와 HTTP 개념 이해하기
클라이언트와 서버 1. 네트워크 기본 네트워크는 컴퓨터와 컴퓨터간의 연결을 의미한다. 우리가 사용하는 거의 모든 서비스는 네트워크를 이용한다. ex) 카카오톡 메세지를 받고 친구에게 선물을 할 수 있는 이유는 우리의 컴퓨터(스마트폰)와 카카오회사의 컴퓨터와 연결되었기 때문이다. 2. 클라이언트와 서버 클라이언트(Client) : 네트워크에서 정보를 요구해서 받는 쪽 서버(Server) : 정보를 제공해주는 쪽 보통 우리가 사용하는 웹, 앱은 클라이언트이다. 그리고 상품 정보, 로그인, 이미지 등을 전달해주는 쪽은 서버이다. 실제로 우리가 사용하는 웹, 앱 서비스는 다양한 서버들과 통신하고 있다. 우리가 브라우저에서 웹에 접속한다는 것은 웹 서버에서 웹(HTML, CSS, JS)를 다운받은 것 우리가 웹에..
2021.04.28 -
[Javascript] callback(콜백)함수
-함수는 매개변수(parameter)를 넣을 수 있다. -함수는 값을 반환할 수 있다. 함수가 javascript의 꽃이라고 불리는 이유는 함수가 정말 많은 곳에서 사용되기 때문이다. "callback(콜백)함수" 콜백 함수는 함수가 나중에 불린다고 해서 CallBack함수이다. 보통 콜백 함수를 구현할 때 함수의 인자에 함수를 넣는 방식으로 진행한다. //1. sayHello라는 함수가 콜백 함수로 사용되는 예시 function sayHello(){ console.log('여러분 안녕하세요'); } function getHuman(callback){ //getHuman 함수의 파라미터에는 함수가 들어간다. callbackFunc(); //callbackFunc 파라미터는 함수이기에 실행시킬 수 있다. ..
2021.04.27 -
[ES6] 문법 익히기
Template Literal 일반적으로 string 자료형을 조합할 때 + 연산자를 사용한다. 그러나 문자열을 더하는 과정이 많아지면 + 연산자가 많아지고 띄어쓰기 같은 작업을 하기가 번거롭다. 이때 Template Literal을 사용하면 더 쉽게 만들 수 있고 가독성이 높아진다. const hello = "안녕"; const introduct = "나는 톰이야." const age = 5; //기존 방식 const text = hello + "! " + introduce + " 그리고 " + age + "살이야." const newText = `${hello}! ${introduce} 그리고 ${age}살이야` Desturcturing(구조 분해 할당) 객체와 배열에 들어있는 값을 가져올 때 Des..
2021.02.05 -
Javascript 핵심 익히기(2)
연산자와 조건문 연산자 -연산자는 변수들(혹은 값)을 가공할 수 있도록 도와준다. -기본적으로 산술(덧셈, 뺄셈)을 돕는 기본 연산자, 값들을 비교하는 비교 연산자, 논리적인 순서를 제공하는 논리 연산자가 있다. 1. 기본 연산자 산술을 돕는 기본 연산자는 +, -, *, / 등이 있다. var num1 = 5; var num2 = 3; var char1 = "경이로운"; var char2 = "소문"; var num3 = num1 + num2; var char3 = char1 + " " + char2; var charNumMixed = char1 + num1; 2. 비교 연산자 값을 서로 비교하는 >, 25); //결과 : true console.log(name === "Tom" && age > 30)..
2021.02.02 -
Javascript 핵심 익히기(1)
Javascript는 웹 개발에 쓰이는 프로그래밍 언어이다. 초기 웹 브라우저의 시대가 열렸을 때 javascript만 작동할 수 있도록 표준이 생겼다. (웹 개발을 하기 위해서 자바스크립트는 필수적!) 변수 변수 : 데이터를 담는 공간 우리가 웹에서 보는 상품 정보, 이미지, ID 입력창 등은 전부 데이터를 바탕으로 보여지는 결과물이다. 선언과 정의 변수를 선언할 때 어떤 변수를 사용할지 정해야한다. 자바스크립트에서는 var, let, const를 사용한다. var = name; name = "Tom"; var name = "Tom"; //1. var는 같은 이름의 변수를 다시 사용할 수 있다. var num1 = 20; var num1 = "Tim"; //2. let은 한번 선언된 변수에 다시 새롭게..
2021.01.30