본문 바로가기

전체 글123

React를 쓰다보니 Redux가 궁금해졌다 📌 Redux를 찾게된 이유? React로 간단한 웹 페이지를 만들고 있었다. 댓글을 입력했을 때 기존 댓글에 내 댓글이 추가되는 기능을 구현하고 싶었다. useState를 사용해서 데이터를 받아와 컴포넌트안에서 조작해주면 내가 원하는 그림을 얻을 수 있었다. 그런데 문제는 형제 컴포넌트였다. 댓글창 외에도 내 개인정보가 담긴 창에 왔을 때 내가 쓴 댓글들이 촤라락 보이게끔 만들고 싶었다. 그럴려면 댓글창에서 업데이트 된 그 정보가 개인정보 창에도 필요할 것 같았다. 즉, 다른 컴포넌트 안에 있는 정보를 이 컴포넌트가져와야 하는데... 필요한 코드를 그대로 복붙하는 것 말고는 방법이 생각이 안났다. State와 Props를 몰랐을 시절 ㅋㅋㅋㅋㅋ 이 방법이 너무 싫어서 구글링해보다가 global stat.. 2021. 8. 18.
자바스크립트 Math.sqrt( ) 사용하지 않고 제곱근 구하기 📌 바빌로니아 방법 Babylonian method 여기서 Xn은 말 그대로 근사값이다. S에 루트를 씌운 값에 가장 가까울 거라 생각하는 근사값을 넣어주면 된다. 어떤 값을 넣든지 점화식을 반복하다보면 결국, Xn+1이 S의 제곱근에 근접하는 순간이 온다. (그치만 그게 언제일지는 보장못함) 📌 코드로 구현하기 ◾ 초기안 수도 코드 ◾ 코드 구현 값은 잘 나오는데 ... 구체적으로 코드가 어떻게 구동하는 지 궁금했다. ◾ 문제점 근사값이 점점 원래값의 제곱근에 가까워지는 걸 확인할 수 있었다. 그런데 ... 근사값은 결국 3.xxxxxxxxxxx 형식을 넘지 못한다. 그리고 9같이 제곱근이 정수로 떨어지는 숫자 이외의 값을 입력받으면 while문이 무한반복될게 뻔하다. 무한반복을 끊어줄 break문이 .. 2021. 8. 17.
자바스크립트 배열 고차함수 reduce 📍 Array.prototype.reduce ( immutable ) reduce 메서드는 자신을 호출한 배열을 모든 요소를 순회하며 인수로 전달받은 콜백함수를 반복 호출한다. 그리고 콜백 함수의 반환값을 다음 순회 시에 콜백 함수의 첫번째 인수로 전달하면서 콜백 함수를 호출하여, 하나의 결과값을 만들어 반환한다. // 1부터 4까지 누적을 구한다. // 숫자끼리 값을 더할 때는 초기값을 0으로 설정하지 않아도 값이 나오지만 // 그래도! 그래도! 초기값을 넣어주는 게 좋다. const sum = [1, 2, 3, 4].reduce( // 콜백 함수 (accumulator, currentvalue, index, array) => { accumulator + currentvalue }, // 초기값 0);.. 2021. 8. 15.
자바스크립트 문서 객체 모델 DOM (Document Object Model) Achivement Goals ✅ DOM의 개념을 이해할 수 있다. ✅ DOM의 구조를 파악하고, HTML과 DOM이 어떻게 닮아있는지 알 수 있다. ✅ HTML에서 Javascript 파일을 불러올 때 주의점에 대해서 이해할 수 있다. 📌 웹 페이지는 어떻게 만들어지는가? 웹 브라우저는 원본 HTML문서를 읽고, Style을 입히고, 대화형 페이지로 만들고, 뷰포트에 표시하는 등 해석 과정을 거친다. 이렇게 해석하는 과정을 "Critical Rendering Path"라고 한다. 🏁 Critical Rendering Path Critical Rendering Path 01 Constructing the DOM Tree 02 Constructing the CSSOM Tree 03 Running JavaS.. 2021. 8. 14.
자바스크립트 배열 Array 📌 자바스크립트의 배열은 배열이 아니다? 자료 구조data structure에서 말하는 "배열" === 동일한 크기의 메모리 공간이 빈틈없이 연속적으로 나열된 자료 구조. 즉, "배열"의 요소는 하나의 데이터 타입으로 통일되어 있으며, 서로 연속적으로 인접해 있다. ( 밀집 배열dense array ) 하나의 데이터 타입으로 통일되어있다는 얘기는 각 요소가 동일한 데이터 크기를 가진다는 뜻과 일맥상통하다. 일반적인 배열 장단점 장점: 인덱스로 요소에 빠르게 접근할 수 있다. 단점: 특정 요소를 검색/삽입/삭제하는 경우에는 비효율적이다. 즉, 자바스크립트의 배열은 연속적으로 이어져 있지 않을 수 있다. ex. 희소 배열 즉, 자바스크립트의 배열은 요소를 위한 각각의 메모리 공간이 동일한 크기를 갖지 않아도.. 2021. 8. 13.
21.08.11 코드스테이츠 SEB 디너클럽 후기 📌 코드스테이츠 SEB 디너클럽 예전에 DS+AIB분들이 가졌던 디너클럽 게시물을 아무것도 모른채 좋아요를 누른적이 있었는데...ㅎ DS와 AIB가 SEB와는 다르다는 걸 왜 직관적으로 모르지? 너 신박하다 ㅎㅎ 수강생분들의 후기에 등장하는 "캐릭터들의 탁상 모임"이 궁금해서 이번엔 제대로 !!!! 좋아요를 눌렀다. 아 물론 ! 여태 만난 페어분들 외에 다른 분들은 어떻게 공부하고 있는지도 알고싶었다. 이번에 Gather는 처음 써보는데 너무 귀엽고 추억이었다. 옛날에 때밀이 게임했던 것도 생각나고 ! " 아 그리고 저는 모임 끝나기 전까지 식탁 의자에 앉지 못했는데 같이 참여하셨던 분들 캡쳐본을 보면 제가 앉아있더라고요?이게 저만의 오류인지 아니면 다른분들도 본인이 식탁에 앉아계신걸 못보시는지 궁금하네.. 2021. 8. 12.
자바스크립트 원시 타입 & 객체 타입 Primitive type & Reference type 📌 원시 타입? 객체 타입? 자바스크립트가 제공하는 7가지 데이터 타입들을 크게 원시 타입primitive type과 객체 타입object/reference type으로 구분할 수 있다. 📌 원시 타입과 객체 타입 특징 💡 원시 타입 primitive type 특징 01 원시 값은 "변경 불가능"한 값이다. --> immutable value --> 데이터의 신뢰성을 보장한다. 02 원시 값을 변수에 할당하면, 변수 (확보된 메모리 공간) 에는 실제 값이 저장된다. 원시 값이 변하지 않는 건 사실이지만, 변수에 저장된 원시 값은 재할당을 통해 새로운 값을 줄 수 있다. 그러나 이 경우도 원래 변수에 할당된 원시 값을 새로운 값으로 교체하는 것이 아니라, 변수가 참조하던 메모리 공간의 주소를 변경해 새롭게.. 2021. 8. 12.
HTML 태그별 display 속성 📌 Inline ◾ : inline ◾ : inline ◾ : inline ◾ : inline 📌 Block ◾ : block ◾ : block ◾ : block ◾ ~ : block ◾ : block ◾ : block ◾ : block ◾ : block 2021. 8. 11.
HTML <input> type 속성 ◾ text : 일반 텍스트를 입력받을 수 있습니다. ◾ password : 패스워드를 입력받을 수 있도록, 입력값이 화면에 보여지지 않도록 합니다. ◾ submit : 태그 내에 입력된 데이터를 서버로 전달해 줍니다. ◾ button : 버튼을 생성해 줍니다. ◾ checkbox : 체크박스 형태의 입력을 받을 수 있습니다. ◾ radio : 라디오 버튼 형태의 입력을 받을 수 있습니다. ◾ reset : 태그 안의 사용자 입력을 초기화 합니다. 2021. 8. 10.
CSS font-size 속성 ◾ medium : 웹브라우저에서 정한 기본 글자크기입니다. ◾ xx-small, x-small, small, large, x-large, xx-large : medium에 대한 상대적인 크기입니다. ◾ smaller, larger : 부모 요소의 글자 크기에 대한 상대적인 글자 크기입니다. ◾ length : px, %, em, rem 등으로 크기를 정합니다. ◾ initial : 기본값으로 설정합니다. ◾ inherit : 부모 요소의 속성값을 상속받습니다. 2021. 8. 9.
CSS flex-box 의 부모 속성 align-items 📌 Flex-Box : Flex Container 나는 부모 속성 🏁 align-items: stretch / flex-start / flex-end / center / baseline ❗ item들이 한 줄일 경우 ! align-items 속성을 사용한다. 왜냐 ?? flex-wrap을 통해 2줄 이상일 경우에는 align-content속성이 우선시된다. --> align-items를 사용하려면 align-content속성을 기본값(stretch)로 설정하거나 아예 사용하지 않아야한다. --> 그래서, justify-content와 align-items의 조합을 많이 사용하는 게 아닌가 싶다 --> justify-content로 flex-line 정리하고, align-items로 item들 라인 정리하.. 2021. 8. 8.
CSS flex-box 의 부모 속성 justify-content & align-content 📌 Flex-Box? 말 그대로 어어엄청 힙한 아이 부모요소에 꼭 flex-box를 넣어줘야 자식요소들이 flex속성을 활용할 수 있다 helloflex abc helloflex 📌 Flex-Box : Flex Container 나는 부모 속성 🏁 display: flex .container { display: flex; } item들이 가진 내용물의 width만큼 너비를 차지한 채, inline요소들처럼 다닥다닥붙는다. 여기서 container에 height을 설정해주면 item들도 부모 높이 따라서 좌라락 예쁘게 놓여진다. 🏁 display: inline-flex .container { display: inline-flex; } flex가 div처럼 화면 한 줄을 잡고 촤라락이라면 inline-fle.. 2021. 8. 7.
첫 설계 twittler 📌 기본 화면 📌 css 변화들 2021. 8. 6.
Node.js npm과 package.json 📌 npm이란?? Node Package Manager 약자 node.js 환경에서 필요한 모듈을 다운받기 위한 "모듈 스토어" 이다. ( ex. 리눅스의 PM은 apt, MacOS의 PM은 brew, Node.js의 PM은 npm ) 다른분들이 만들어놓은 좋은 모듈들을 node.js에서는 "nmp모듈" 이라고 부른다. 우리는 이러한 모듈들을 어떻게 효율적이고 생산적으로 조립할건지 지속적으로 고민해야한다. 🏁 npm 설치했을 때 장점 프로젝트 코드를 다른 사람에게 전달할 때, 프로젝트가 포함하고 있는 모든 모듈을 다 전달하지 않아도 된다 ! --> "우리 코드는 여기있고, 필요한 모듈들은 package.json에 있는 리스트 보고 네가 직접 다운받아서 써 ~" ◾ npm 설치하기 npm install ◾.. 2021. 8. 5.
Node.js 는 뭐야? 일단 설치해봐 Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. Achivement Goals ✅ nvm, Nodejs, npm을 설치하고, 버전을 확인할 수 있다. ✅ 명령어 node를 이용해 JavaScript 파일을 실행할 수 있다.\ ✅ 스프린트 시작 전 package.json 파일을 확인하고, npm install을 사용할 수 있다. 📌 Node.js는 또 뭐야? JavaScript의 런타임. 🏁 런타임이란? 어떤 프로그램이 동작할 때, 프로그램이 동작하는 곳 ( ex. 웹 브라우저 ) 자바스크립트의 런타임은 웹 브라우저 밖에 없었는데, node.js의 등장으로 그 역할이 확장되었다. 웹 페이지 뿐만 아니라 서버와 같은 다른 프로그램도 만들 수 있다 ! ! // runnode.js const test.. 2021. 8. 4.
[ 리눅스 삽질기 ] 패키지와 패키지 매니저 📌 패키지? 하나의 프로그램이 정상적으로 설치되고 동작하기 위한 모든 파일이 압축되어 있는 것. 🏁 프로그램 파일 🏁 프로그램 설치 파일 🏁 프로그램 설치 설명서 🏁 프로그램에 대한 정보를 담은 파일 ( ex. 프로그램A를 설치하기 위해서는 프로그램B가 필요하다 ) 📌 패키지 매니저? 패키지의 설치, 변경, 삭제 등 관리를 편하게 해주는 도구. 우린 하나의 프로그램만 사용하지 않는다. 여러개의 프로그램을 다운받아 다양하게 활용한다. 프로그램은 지속적으로 업데이트되는 특성을 가지고 있고, 이를 사용자가 관리해줘야한다. 프로그램 수가 늘어갈수록 우리가 기억해야할 프로그램 저장소의 위치와 개수 또한 늘어간다. 저장소에 직접 방문해서 업데이트를 해줘야하기 때문이다 !!! --> 이 단점을 보완하기 위한 도구가 .. 2021. 8. 3.
[ 리눅스 삽질기 ] CLI 텍스트 에디터는 뭘 써야할까? nano? Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 왜 CLI 텍스트 에디터를 공부해야하나? 원격 서버 환경에서 원격으로 텍스트 파일을 편집해야하는 경우가 분명히 존재한다. 터미널에서 파일과 폴더를 자유자재로 다룰 수 있는 에디터 하나는 마련해놓는 게 좋다. 📌 왜 nano? vim(vi)나 emacs에 비해 진입장벽이 낮다. nano가 편하긴 한데, 뭔가 vim 잘하고싶다. ㅋㅋㅋㅋ ◾ 터미널에서 nano 명령어로 파일을 열어준다. 01 nano [파일명.확장자] 02 nano // 그냥 실행할 수도 있음 친절하게 밑에 명령어도 적어준다 ^!^ 나는 ... vim(vi) 도전한다 ! 2021. 8. 2.
[ 리눅스 삽질기 ] 리눅스 절대 경로와 상대 경로 Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 절대 경로 기준점( 루트폴더 ' / ' )으로부터 파일이나 폴더의 절대적인 위치를 나타냄. // 절대 경로 /home/[username]/ // 절대 경로 진입 cd /home/[username]/ 📌 상대 경로 현재 위치를 기준점으로 파일이나 폴더의 위치를 나타냄. // 상대 경로 ./[user.name] // 상대 경로 진입 cd ./[user.name] // 현재 폴더 아래에 있는 [user.name] 폴더로 진입하는 명령어 cd ../[폴더명] // 현재폴더의 상위 폴더에 있는 [폴더명] 폴더로 진입하는 명령어 // . :현재폴더 // .. :상위폴더 // / :폴더 내부 📌 사용자 권한과 관리자 권한 Ubuntu를 처음 설치할 때 입.. 2021. 8. 2.
[ 리눅스 삽질기 ] 리눅스 터미널 명령어를 이해해보자 Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 Achivement Goals ✅ 리눅스 터미널을 실행할 수 있다. ✅ CLI를 이용한 작업과 GUI를 이용한 작업이 동일함을 이해할 수 있다. ✅ 리눅스 터미널에서 기본적인 명령어를 사용할 수 있다. ✅ 명령어를 사용할 때, 등장하는 키워드에 대해 이해할 수 있다. ✅ 절대 경로와 상대 경로의 차이를 이해할 수 있다. -- 절대 경로의 시작이 루트 디렉토리(/)인 것을 이해할 수 있다. -- 상대 경로의 시작이 현재 디렉토리(.)인 것을 이해할 수 있다. ✅ 텍스트 에디터 nano를 이용해 파일을 수정하고, 저장할 수 있다. 📌 CLI 기본 중의 기본 ◾ Terminal 터미널 01. Ctrl + Alt + t 02. terminal 검색 .. 2021. 8. 1.
[ 리눅스 삽질기 ] 우분투에서 시간이 제대로 안뜬다고요? Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 나의 고향은 뉴욕 왜 이렇게 넘어야 할 산이 많은겁니까 ! 아 물론 우분투 설치할 때, 도시를 New York으로 설치한 제 잘못도 있습니다 다시, 서울로 바꿔봅시다..>! 📌 우분투 시간 설정하기 다른 아이들과 동일하게, 터미널에서 진행합니다. ◾ 현재 설정된 시간 알아보기 $ timedatectl Local time: Tue 2021-07-27 11:55:18 EDT Universal time: Tue 2021-07-27 15:55:18 UTC RTC time: Tue 2021-07-27 15:55:18 Time zone: America/New_York (EDT, -0400) System clock synchronized: yes NTP .. 2021. 7. 31.
[ 리눅스 삽질기 ] 우분투 마이크 잡음 제거하기 ! Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 우분투에서 웹캠 마이크 잡음 제거하기 ◾ 마이크로 내 목소리가 잘 들어가는 지 확인해줍니다 목소리를 낼 때마다 음량 변화하는 게 느껴진다면, 잘 출력되고 있는겁니다 :) ◾ 터미널을 키고, 다음 명령어들을 입력합니다. sudo vi /etc/pulse/default.pa 그럼 다음과 같은 화면이 보이실거에요 블라블라 ... ↓ 화살표 버튼을 눌러서 쭈우우욱 내려가셔서 이 화면을 찾아야합니다. ❗ 저는 문구를 추가한 상태이지만, 여러분들은 load-module module-filter-apply까지만 있어야합니다 ! ◾ 그 밑에 바로 주변 소음을 차단해주는 문구를 넣어줄거에요 load-module module-echo-cancel 마치 메모장을.. 2021. 7. 30.
[ 리눅스 삽질기 ] 우분투에서는 이모티콘 어떻게 써요 ? Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 기본적으로 설치되어있는 GNOME-character 우분투에서 character를 검색하시면 나올거에요 참... 이런것도 검색해서 찾아야하니 !! 몇개 없긴 한데 나름 쓸만합니다 ! 예 뭐 ... 블로그 쓸 때 꾸미는거니까 *^^7 미니멀하게 가자고 📌 나 불편해. 더 많이 ! 더 편하게 ! 쓸거야 시간나면 설치해 볼 아이 어떻게 GNOME Shell을 확장해서 쓸건지는 더 알아봐야한다 https://github.com/maoschanz/emoji-selector-for-gnome GitHub - maoschanz/emoji-selector-for-gnome: This extension provide a popup menu with some .. 2021. 7. 29.
CSS padding /* 네 면 모두 적용 */ padding: 1em; /* 상하 | 좌우 */ padding: 5% 10%; /* 상 | 좌우 | 하 */ padding: 1em 2em 2em; /* 위 | 오른쪽 | 아래 | 왼쪽 -> 시계 방향 */ padding: 5px 1em 0 2em; /* 전역 값 */ padding: inherit; padding: initial; padding: unset; 2021. 7. 28.
CSS box-sizing: content-box와 border-box의 차이 📌 CSS 기본 박스 모델 Content-box 크기에만 width와 height가 적용된다. (Padding X, Border X, Margin X) 따라서 원하는 크기의 박스를 그리려면, Padding 값이나 Border 값을 고려해야한다. ^아오 귀찮아^ 🏁 그래서 등장한 box-sizing! 솔직히 우리, Parent container안에 있는 Child container들 ... Parent가 정한 영역에서 빠져나오지 않았으면 하는 것들이 대부분이잖아 ... ◾ box-sizing: content-box CSS 기본 박스 모델을 따른다 ! 에라 모르겠고 ! 난 그냥 Content에만 width, height 줄거야 ! Padding, Border 나몰라라~ 100px width를 설정하게 되면 .. 2021. 7. 27.
[ 리눅스 삽질기 ] 우분투에 Git 설치하며 겪었던 다양한 문제들 Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 우분투에 Git 설치해볼까? 얼른 VSCode에서 git 명령어를 입력하고 싶다... 잔디 심기 얼른 하고싶다 ! 서둘러 설치해보자 📌 우분투 Git 설치 명령어 🏴 git 패키지 리스트를 업데이트한다. sudo apt-get install git 🏴 git을 설치한다. sudo apt install git 🏴 github에서 사용하는 사용자 이름과 메일주소를 입력해 git과 연동해준다. // --global 옵션 // 사용자 홈에 설정이 저장되기 때문에 한번 입력하면 계속 사용할 수 있다. // 추후에 github 사용자 이름이나 이메일을 변경한다면, 이 명령어를 다시 입력해야한다. git config --global user.name 이름.. 2021. 7. 26.
[ 리눅스 삽질기 ] 우분투에 Visual Studio Code 설치하며 겪었던 다양한 문제들 Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 우분투에 VSCode 설치해볼까? 윈도우보다 리눅스가 편하고(?) 깔끔한 건(?) --> 개인 차가 심하지만 .. 프로그램 설치파일이 지저분하게 남지 않는다는 점이다. 윈도우는 설치 버튼을 클릭해 파일을 다운로드 하고, 관리자 권한으로 실행 후 설치파일을 지워야 했다면 --> GUI 특성 (설치 파일을 지우는 걸 깜빡하면 나중엔 뭐가 중요한 파일인지 구분을 못하겠더라) 리눅스는 프롬프트에서 파일 설치 권한을 주는 명령어만 입력하면 설치와 삭제가 간편하기에 찌꺼기(?) 들을 따로 관리해주지 않아도 된다. --> 패키지와 패키지 매니저 :) 물론 단점도 있다. 파일의 트리 구조를 머리속으로 그려가며 명령어를 신중히 입력해야 된다. 그래도 나는 리.. 2021. 7. 26.
[ 리눅스 삽질기 ] 윈도우에서 리눅스로 완전히 !! 아예!! 넘어가기 Ubuntu 20.04.2 LTS 환경에서 실행되었습니다. 📌 왜 리눅스니 ? GUI 잘되어있는 윈도우버리고 CLI 오지게 써야하는 리눅스로 왜 왔을까 ? 몰라 그냥 멋있어 마치 나도 오픈소스 프로젝트에 참여하고 있는 것만 같은 느낌이 들잖아 ^ㅁ^ 윈도우, 맥 OS 사용하는 곳 제외하면 ( 아 물론 맥 OS도 유닉스 기반 ) 다 리눅스 쓰니까 이번김에 익숙해지자는거즤 그리고 서버쪽에서는 리눅스를 다루는 일이 빈번하다 !! ....풀스택 대비..?! ㅎㅎㅎ하하 🏁 진짜 이유 자바스크립트는 특히 오픈 소스, 특히 npm을 기반으로 발전해왔다. 이 거대한 생태계를 기반으로 개발자들이 스스로 업데이트하고, 발전해왔다. 문제는 이 ecosystem이 macOS 사용자 위주로 구성되어 있다는 점이다. --> 본격.. 2021. 7. 25.
자바스크립트 문자열 String 📌 String 생성자 함수 const strObj = new String(); console.log(strObj); // String{length: 0, [[PrimitiveValue]]: ""} // [[PrimitiveValue]]는 [[StringData]] 내부 슬롯이다 ❗ String 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면, [ [ StringData ] ] 내부 슬롯에 빈 문자열을 할당한 String 래퍼 객체를 생성한다. String 래퍼 객체 === 유사 배열 객체 const strObj = new String('Lee'); console.log(strObj); // String{0:"L", 1:"e", 2:"e", length: 3, [[PrimitiveVal.. 2021. 7. 24.
자바스크립트 제어문 Control flow statement Achivement Goals 🏁 조건문 ✅ truthy와 falsy 가 조건문에서 작동하는 방식을 이해할 수 있다. ✅ 비교연산자를 통한 엄격한 비교(=== , !==)에 대해 이해할 수 있다. ✅ if 와 else if , else를 이해하고 무리없이 활용할 수 있다. ✅ 논리연산자를 (&&, ||, ! ...)을 통해 복잡한 조건을 간결하게 작성할 수 있다. 🏁 반복문 ✅ 반복문을 활용하여 단순한 기능을 반복하여 수행할 수 있다. ✅ for문과 문자열, 숫자를 이용해 반복적으로 코드를 실행시킬 수 있다. ✅ 기본적인 for문 (for (let i = 0; i < 5; i++))을 응용하여 다양한 for문을 만들 수 있다. ✅ for와 while의 차이에 대해서 설명할 수 있다. ✅ 반복문에 조건문을.. 2021. 7. 23.
자바스크립트 함수 Function Achievement Goals ✅ 함수가 "작은 기능의 단위"라는 것을 이해할 수 있다. ✅ 함수 선언을 위해 필요한 keyword, name, parameter, body에 대해 이해할 수 있다. ✅ 함수 선언과 호출의 기초적인 작동 원리를 이해할 수 있다. ✅ 함수가 선언되어 함수 표현식이 변수에 담기는 과정을 설명할 수 있다. ✅ 함수의 결과값이 변수에 할당되어 담기는 과정을 설명할 수 있다. ✅ 함수의 호출과 리턴에 대해서 이해하고, 실제 코드로 작성하여 활용할 수 있다. ✅ 함수 그 자체(func)와, 함수의 호출(func())를 구분하여 사용할 수 있다. ✅ 매개변수(parameter)와 전달인자(argument)를 구분하여 사용할 수 있다. ✅ 같은 기능을 하는 함수를 선언식, 표현식, 화.. 2021. 7. 22.