전체 글
-
일반 함수와 화살표 함수의 this는 무엇이 다를까?JavaScript 2023. 11. 26. 22:16
이전에 살펴본 바에 따르면 https://kimhugo.tistory.com/84 javascript의 this에 대해 꼭 알아야하는 핵심 "this는 함수를 호출한 객체이다" this는 객체를 가리키는 키워드이다. 그런데 상황에 따라 뭘 가리키는지 달라지므로 살펴보자. 1. Global scope에서 : window 객체 - 브라우저의 정보를 갖고 있음 브라 kimhugo.tistory.com const object = { name: "김휴고", main: function () { console.log(this); }, }; const object2 = { name: "다른 객체", main: object.main, }; object.main(); // object object2.main(); // o..
-
javascript의 this에 대해 꼭 알아야하는 핵심JavaScript 2023. 11. 26. 21:28
"this는 함수를 호출한 객체이다" this는 객체를 가리키는 키워드이다. 그런데 상황에 따라 뭘 가리키는지 달라지므로 살펴보자. 1. Global scope에서 : window 객체 - 브라우저의 정보를 갖고 있음 브라우저에서 위 코드를 실행하면 현재 브라우저의 여러 정보가 담긴 객체가 호출된다. 나는 node.js로 실행시켰기에 빈 객체가 호출되었다. 2. function scope에서 : 함수를 호출한 객체 여기서는 먼저 브라우저로 실행시켰다. function main() { console.log(this); } console.log(window); main(); JS로 함수를 만들면, window 객체의 내부에 함수가 저장된다. 따라서 위 코드처럼 main()을 호출하면, window객체가 ma..
-
변수 선언var, let, const 중에 뭘 써야 할까?JavaScript 2023. 11. 25. 22:34
JS는 변수 선언에 세 가지 예약어를 쓸 수 있다. var은 global(광역) 변수. 어디서 선언하든지, 모든 스코프에서 사용 가능. 하다고 학원에서 배웠었다. 그런데! 실제로는 함수 안에서 정의한 var 변수는 지역변수(local variable)로 해당 스코프를 벗어난 영역에서 사용할 수 없었다. 결론은 var도 스코프가 적용된다. 그렇다면 왜 let과 const가 탄생하게 된 걸까? 1. 하위 스코프에서의 변경사항이 상위 스코프에도 영향을 끼침 var myName을 광역변수로 설정. 이후 함수에서 myName의 값을 변경하도록 만들고 실행하면 해당 함수 바깥에서도 myName의 값이 변경되어 있는 걸 확인. 즉, 로컬 레벨에서의 변경이 글로벌 레벨까지도 적용된다. 2. 글로벌 변수와 같은 이름의 ..
-
1. Node.js란 무엇인가, 설치와 간단한 실행Node.js 2023. 11. 21. 13:30
1.1 Node.js is a JavaScript Runtime Node.js는 JS를 다른 환경에서 만든 버전 서버, 컴퓨터, 다른 어떤 기기에서도 프로그램 언어로 기능함 웹 환경 기반 앱 개발에 유용 JS의 일부기능(HTML 컨트롤 관련)은 제외됨 1.2 V8 : 구글에서 만든 JS엔진 엔진 : 브라우저 또는 노드의 JS코드를 머신 코드로 컴파일 C++ 기반으로 만들어짐 즉, JS코드를 해석하고 실행시키기 위해 구글에서 크롬 브라우저의 구성요소로 만든 것이 V8 V8의 인기와 백엔드 언어로서 가능성을 보고 브라우저로부터 독립시켜 만들어 낸 것이 Node.js 1.3 Node.js 설치 https://nodejs.org/en Node.js Node.js® is a JavaScript runtime bu..
-
유용한 git UI app소개와 Git 설치, 초기 환경설정, alias 지정하기GIT 2023. 10. 10. 10:07
1. git UI app 소개와 Git 설치 1.1 Git UI app 추천 git sourctree : 현업에서도 많이 사용함. 간단 명료. git kraken : UI가 아주 잘 구현되어 있다. 적절하게 사용하면 좋다. 다만 git의 다양한 기능을 모두 반영하지 않고, 각 버튼이 어떻게 작용하는지 확인하기 어려우므로 처음 배울 때는 window-cmder, mac-iterm2 등을 통해 공부하는 걸 추천 [git 설치 확인] git --version 미설치 시 공식 사이트에서 다운로드 받자 git 공식 사이트 : http://www.git-scm/com 1.2 git 환경 설정 //현재 환경설정 전체를 보여즘 git config --list //환경설정 중 공통부분 편집기를 연다 git config ..
-
[day6] 발표일프로젝트/MBTI 게시판 2023. 9. 21. 12:16
[daily log] 내 브랜치 수정사항 git으로 공유하기 on my branch git add * 이 때 아직 작업 중인 파일은 제외하고 싶으시면 git add (파일주소/파일명)으로 하나씩 올리시거나, git add * 하고 git restore (파일주소/파일명) 하셔서 그 파일만 제외하면 됩니다. git commit git commit -m “커밋 제목” : 커밋 제목만으로 간단하게 커밋하기 git commit : commit 제목과 내용을 구체적으로 수정할 수 있는 에디터 창이 뜹니다 git push origin ‘내 브랜치 이름’ 이제 서버에 내 브랜치에서 작업한 결과는 업로드 완료! git checkout main : 이제 main branch로 이동해볼까요? git diff main..‘..
-
Day4] navi 완성 및 각 controller에 탑재프로젝트/MBTI 게시판 2023. 9. 20. 10:04
* Navigator는 갱신되지 않도록 두고, 클릭 이벤트에 따라 Container 부분만 변하게 만드는 건 패스. 현재 내가 jsp로 할 수 있는 영역이 아닌 것 같다. 이에 따라 오늘부터는 클릭 이벤트가 넘겨주는 값에 따라 다른 Container가 나오도록 한다. 1. header.jsp에서 li로 작성했던 navi를 a 태그로 변경 Home Test Counseling Center Log In 2. Log in 여부에 따라 navigator에서 Log in 버튼 다르게 출력하기 로그인 되지 않은 상태라면 'Log In' 링크, 로그인 된 상태라면 '(사용자 이름)님 환영합니다!' 출력. homeCtrl에서 session을 검사해서 log in 여부 판단하기. String loginBtn = "Log..
-
Day3] MVC모델 게시판 - homeController 만들기프로젝트/MBTI 게시판 2023. 9. 19. 10:21
기존 프로젝트에서 사용하던 JS 코드를 최대한 배제하고, MVC와 JSP를 활용한다. 1. home controller를 만들고, WEB-INF 폴더 하에 home.jsp파일을 위치 //homeCtrl.jsp 코드 WEB-INF 아래에 위치시키면, 브라우저가 home.jsp에 직접 접근할 수 없고 작성한 코드가 어떻게 적용되는지 바로 확인하기가 어렵다. 그래서 homeCtrl.jsp 파일을 간략하게 먼저 만들었다. 아직 로그인 페이지에서 데이터가 어떻게 넘어오는지 확실하지 않아, get 방식 접근 시만 작성하였다. 2. home.js -> JavaBeans로 변경 하려고 home.js를 열어봤다. 코드를 읽다보니 이상해서 home.jsp를 열어봤다. home.js를 사용하지 않는다. ㅎㅎhome.jsp의..