JS (Java Script) 80

변수 선언 let const var 차이

let 재할당이 가능하다. let a = 2; a=6; 재선언은 불가하다. let a = 2; let a = 6; 변수가 동작하는 범위는 모든 {} 안이다. for나 if 등등 "블록스코프" 를 가지고 있다. 괄호 밖에서 선언한 변수명과 동일하게 괄호 안에서 선언할 경우, 재할당이 되지 않고, 서로 다른 변수로 취급한다. 괄호 밖은 전역변수로, 괄호 안은 지역변수로. const 변하지 않는 값(상수)를 넣을때 많이 쓴다. 재할당이 불가하다 재선언도 불가하다. 변수가 동작하는 범위는 모든 {} 안이다. for나 if 등등 const를 이용해 대문자로 변수명을 설정하는건 주로 하드코딩 값의 별칭을 만들때 사용한다. COLOR_ORANGE는 "#FF7F00"보다 기억하기가 훨씬 쉽다 + const people..

JS (Java Script) 2023.08.29

변수의 작동 원리

메모리는 0과 1을 저장할 수 있는 칸, 그리고 그 칸의 주소를 가지고 있는데, 어디 주소에 어떤 데이터가 있는지 알아야 접근 할 수 있다. 우리는 "변수"를 이용해 데이터를 손쉽게 불러오고 처리 하는 등 아주 편리하게 사용 할 수 있다. 그런데 이 변수는 도대체 어떻게 동작하는 걸까? 일단 메모리에 대한 이해가 필요하다. 메모리에는 변수 영역, 데이터 영역이 존재한다. 변수의 선언 let apple; 이 변수 영역에 빈공간을 확보해서 식별자를 저장한다. 즉 변수명을 변수영역 메모리 중 빈공간에 집어넣는다는 말이다. 변수의 할당 apple = '사과'; 일단 컴퓨터는 "사과" 라는 문자에 대한 정보가 없다. 우리는 컴퓨터의 메모리 공간에 저 데이터를 넣어주어야 컴퓨터가 일을 한다. 데이터 영역에 빈공간을..

JS (Java Script) 2023.08.29

use strict 에 대해서

이게 뭐임? ES5 가 나오면서 생김 원래 자바스크립트는 기존에 기능들을 변경하지 않고, 추가만 해왔음. 그래서 기존 코드가 오류 발생하지 않았음. ES5 가 나오면서 새로운 기능 추가 및 기능 중 일부 변경되었는데 그럼 호환성 문제가 생기게 된다. 호환성 문제를 줄이기 위해 변경된 사항들 대부분은 ES5 기본모드에서 비활성화 상태로 이용하도록 설계되었다. 이거 어떻게 씀? 활성화 하기 위해서 use strict 라는 지시자를 이용한다. 변경된 기능 사용하겠다는 말. 우린 이걸 strict mode 실행한다 고 한다. . 보통 스크립트 최상단에 위치하지만, 가끔 함수 본문 맨 앞에 위치하는 경우도 있따. (그럼 해당 함수만 strict mode 로 됨.) 왠만하면 스크립트 최상단에 위치해야 한다! 이거 ..

JS (Java Script) 2023.08.29

프로그래밍 패러다임 이란? (왕초보 이해용)

프로그래머에게 프로그래밍의 관점을 갖게 해주고, 결정하는 역할을 한다 특정 프로그램을 설계, 개발, 문제 해결을 할때 주축이 되는 특정한 방법론과 사고의 흐름을 공유하고 있으면 패러다임이라고 볼 수 있을 것 프로그래밍 언어들은 특정 패러다임과 관련한 문법을 지원하거나 혹은 지원하지 않는다. 자바스크립트는 객체 지향, 함수형 프로그래밍 스타일에 적합한 고수준의 동적인 인터프리터 언어! 특정 문법은 java와 같은 c계열 언어에서 차용, 일급 함수라는 개념은 스킴에서 가져왔고, 프로토타입에 기반한 상속은 셀프라는 유명하지 않은 언어에서 가져왔습니다.

JS (Java Script) 2023.08.29

Garbage Collection 이란? Trade-off 란?

많은 프로그래밍 언어들이 존재하는 이유들 중 2번째. 성능/안정성 과 편의성의 Trade-off 관계. . 일단 Garbage Collection 이란? 번역하면 "쓰레기 수집" 이란 말ㅋㅋ 동적 할당된 메모리 영역 가운데, 더이상 사용할 수 없게 된 영역을 자동으로 탐지 및 해제하는 기능 . Trade-off 란 ?? 얻는게 있으면 잃는게 있다. 뭐 이런말 언어 자체에서 많은걸 지원할수록 (메모리 관리, 타입 추론 등) 해당 언어로 작성된 프로그램들의 성능과 때로는 안정성이 "일반적"으로 떨어짐. 객체지향 언어들은 (Javascript) Garbage Collection 내장되어 지원함. C, C++ 은 내장되어 있지 않으나 라이브러리 통해 Garbage Collection 사용 가능.

JS (Java Script) 2023.08.29

컴파일 이란? (컴파일 언어/ 인터프리터 언어)

프로그래밍 언어는 왜이렇게 많을까?? 1. 컴파일 여부 2. 성능/안정성과 편의성의 Trade-off 관계 (하나를 얻으면 하나를 잃는다는 뜻) 3. 패러다임 이 3가지로 인해 다양한 언어들이 존재함. 각 언어들 다양한 특성을 가짐. 1. 컴파일이란? 우리가 프로그래밍 언어로 작성한 코드를 컴퓨터가 알아들을 수 있도록 번역해주는 것. 컴파일의 시점, 방법에 따라 언어가 나뉨 컴파일 언어_ C언어, Java 등등 인터프리터언어 _ Python, Javascript 등 컴파일 언어 단점 컴파일 언어는 처음 실행시 컴파일 하는 시간이 필요. 또 번역하는 과정에서 문법을 검사하는 등의 별도의 처리를 거치기에 에러를 미리 마주해야함. 장점 런타임에 (프로그램 실행 중간중간에) 번역하는 과정이 없다 실제 프로그램이..

JS (Java Script) 2023.08.29

e.preventDefault()

HTML 코드 로그인 하세용 전송 닫기 JavaScript 코드 let id = document.querySelector('#id'); let pw = document.querySelector('#pw'); $('.btn-primary').on('click', checkForm); function checkForm(e){ // 여기서 매개변수 e를 넣는건, 이벤트가 발생했을때, 그 이벤트에 대한 정보를 제공하기 위해서 . // 이걸 넣지 않으면 e.preventDefault()가 안먹음 if(id.value === ""){ alert("아뒤 입력요망"); e.preventDefault() // 이벤트가 발생되었을때, 기본적으로 수행되도록 한 동작을 중단시긴다. 현재 상황에서는 다른 html 로 넘어가도록..

JS (Java Script) 2023.06.26

간단한 UI 만들기 ( jQuery 활용 )

우리는 간단한 UI 를 만들때에 1. 적용하고자 하는 UI의 HTML 과 CSS 를 미리 만들어 두고, 2. css의 display를 none 으로 숨겨둔 후에, 3. 필요할때만 어떤 이벤트가 실행되면 의도한 UI의 display 를 block으로 바꾸어 주는 과정을 거쳣다. 그런데 우리는 이제 jQuery 를 이용해서 보다 더 간편하고 쉽게 사용해 보자. 이전에는 document.getElementById('list' ).addEventListener('click', function( ) { document.getElementsByClassName('list-group')[0].style.display = 'none'; }; 이렇게 길게 썻다면 이제는 $('.list').on('click', funct..

JS (Java Script) 2023.06.26

콜백 함수. / addEventListener( )

function( ){ } 이렇게 생긴게 함수인데, 이 ( )소괄호 안에 들어가는 애들을 매개변수. 파라미터 라고 부른다. 이 파라미터는 함수를 동작시킬때 가변적인 요소가 된다. 근데 이 함수의 괄호 안에 또하나의 함수가 들어 갈 수도 있다. 우리는 이것을 콜백함수 라고 부른다. addEventListener( ) 이것 또한 하나의 함수로 본다. 그래서 addEventListener('click' , function(){}) 이런식으로 많이 쓰이기에 소괄호 안에 함수 또한 콜백함수 라고 본다.

JS (Java Script) 2023.06.26