╱╱╭╮╱╱╱╱╱╱╭━━━╮╱╱╱╭╮╱╭╮╱╱╱╱╱╱ ╱╱┃┃╱╱╱╱╱╱┃╭━╮┃╱╱╱┃┃╱┃┃╱╱╱╱╱╱ ╱╱┃┣━━┳━━╮┃┃╱┃┣━╮╱┃╰━╯┣━━┳━╮╱ ╭╮┃┃╭╮┃┃━┫┃╰━╯┃╭╮╮┃╭━╮┃╭╮┃╭╮╮ ┃╰╯┃╭╮┃┃━┫┃╭━╮┃┃┃┃┃┃╱┃┃╭╮┃┃┃┃ ╰━━┻╯╰┻━━╯╰╯╱╰┻╯╰╯╰╯╱╰┻╯╰┻╯╰╯

Frontend/Javascript 15

[Javascript] 함수, 화살표 함수 (function, arrow function)

함수 함수의 개념 자체는 다른 언어의 함수와 같다. 자바스크립트에서 함수는 아래와 같이 생겼다. 전체적인 틀에선 매개변수와 리턴값이 존재한다. 보통 함수를 정의하는 것처럼 함수명, 매개변수, 리턴값, 실행문, 범위로 구성된다. 또한 함수의 매개변수에 기본 값을 정해줄 수도 있다. 아래는 익명함수라는 것인데 말그대로 이름이 없는 함수이다. 이때 noName은 변수명이지 함수명이 아니다. 함수 리터럴을 만들고 함수 리터럴의 주소 값을 변수에 저장하여 사용하는 방법이다. 추가적으로 익명함수에는 기본 값을 설정 할 수 없다. 함수 정의와 익명함수는 호이스팅에서 갈린다. 함수 정의는 자바스크립트 실행 시 최상단으로 끌여올리지는데 익명함수는 그렇지 못한다. 두 함수 모두 정의되기 전에 호출을 했는데 console...

Frontend/Javascript 2022.06.10

[Javascript] 루프와 반복 (loop and iteration)

자바 스크립트에서도 다른 프로그래밍 언어와 같이 반복문을 사용하여 특정한 명령의 실행을 반복시킬 수 있다. for, while과 같은 키워드를 사용하는 것은 동일하다. for문부터 바로 예제를 통해 알아보겠다. 기존에 알고있던 for문과 특히 다를 것이 없다. 변수(i)에 대한 조건식으로 반복횟수를 정하는 방법이다. 자바스크립트에선 다른 형태의 for문도 있다. for in for of 다음으로 for in 문에 대해 알아보겠다. for in문은 하나의 변수를 통해서 객체를 순회(iterate)한다. 임의의 변수와 순회할 객체(enumerable)를 인자로 받는다. 아래의 예제를 통해 설명하겠다. 분명 for in은 객체를 순회한다고 했다. 코드의 의도는 array의 각 요소들의 출력이였다. 그런데 콘솔..

Frontend/Javascript 2022.05.05

[Javascript] 흐름 제어 (Flow Controls)

이번엔 자바스크립트의 프로그램 흐름 제어에 대해 알아볼 것이다. 종료로는 아래와 같이 있다. block statement conditional statements exception handling statements 모두 프로그램의 전체적인 틀을 짤 때 중요한 개념이다. block statement에 대해 먼저 알아보겠다. 쉽게 말하면 한 쌍의 중괄호로 감싸 범위를 표현하는 것을 뜻한다. 자바에서는 if, for, while과 같이 사용되지만 자바스크립트에서는 독립적을 존재할 수 있다. 중괄호로 둘러 쌓여 있다는 것 말고는 특별한게 없다. 내부 -> 외부 접근이 가능한 것은 자바와도 같다. 마찬가지로 외부 -> 내부 접근은 안된다. 이제 conditional statements에 대해 알아보겠다. 쉽게말..

Frontend/Javascript 2022.05.03

[Javascript] 변수 (var, const, let)

자바스크립트에서 변수를 선언하는 방법은 총 3개이다. var let const 모두 변수를 선언하는 키워드이며 가장 큰 차이점으로 버전의 차이가 있다. var - ES6 이전 방식 (구식) let - ES6의 문법 (최신) const - ES6의 문법 (최신) 사실 const와 let은 var를 대체하기 위해 만들어진 것이다. 그러니 var사용을 지양해야한다. 바로 변수를 선언해 보겠다. 3 키워드 모두 잘 작동한다. 그런데 여기서 var 사용을 왜 지양해야하는지 알려주겠다. 실행은 잘 되긴한다. variable의 값이 바뀌었구나로 생각할 수 있다. 하지만 동일 변수 선언이라고 생각해보자. 위의 코드는 아래의 코드와 같은 형태를 띈다. int num=1; // num 초기화1 int num=2; // n..

Frontend/Javascript 2022.05.02

[Javascript] 입문 (html-js link)

우선 Javascript란 웹프로그래밍 언어의 종류로 웹페이지를 더 재미있게 만들어준다. html : structing css : details javacript : interactive 자바스크립트는 웹 사용자의 행동(event)에 따라 추가적으로 기능을 추가하고 기능을 사용자의 행동(event)에 따라 실행 시킬지 말지 설정할 수 있게 만드는 것이다. 많은 웹페이지들은 움직이는거처럼 보여지는데 이는 모두 자바스크립트를 사용한 것이다. 자바스크립트를 이용해면 웹페이지를 더 재미있게 만들 수 있다. 그리고 자바스크립트 코딩을 할 때 Visual Studio Code를 사용할 것이다. 자바스크립트 코드는 js 파일을 통해 저장된다. js파일 혼자 독단적으로 사용할 수는 없고 html 파일과 연동하여 사용한..

Frontend/Javascript 2022.05.02