본문 바로가기

JavaScript | 자바스크립트20

클로저 - closure 클로저 클로저란 외부함수의 변수에 접근할수 있는 내부함수. 또는 그러한 패턴 자체를 클로저, 클로저 패턴 이라고 한다. 전에 스코프를 기술할때에 스코프 외부에서 스코프 내부로는 접근할 수 없다고 했지만 이를 가능하게 해주는것이 클로저, 클로저 패턴 이라고 할수 있다. function hi() { let text = '안녕하세요' function hello() { console.log(text) } return hello } let a = hi() console.log(text) // 참조오류 -> text가 정의되지 않음 console.log(a) // hello함수에 해당하는 내용을 보여줌 a() // '안녕하세요' 이렇게 global scope에서 함수 hi가 갖고있는 function scope또는 .. 2020. 7. 15.
스코프 - Scope 일반적인 변수 선언후 함수 내부에선 전달인자로 받지 않아도 그 변수에 접근 할수 있었습니다. 하지만 함수 내부에서 선언된 변수는 함수 밖에서 접근 할수 없었죠. 왜 그런걸까요...? 스코프 변수에 접근할수 있는 기준 (유효범위) 이라고 할수 있습니다. 모든 변수들은 스코프 외부에서 내부로 접근할 수 없으며, 내부에서는 외부로 접근이 가능합니다. 스코프는 크게 보았을때 global scope와 local scope로 나눌 수 있습니다. global scope 최상단에 해당하는 범위입니다. 전역이라고도 불리며 이 부분에 변수가 선언되면 그 변수를 전역변수 라고 합니다. 글로벌 스코프, 전역변수의 특징으로는 어디서든 접근이 가능합니다. let a = 15 // var a = 15를 써도 같은 결과 입니다. f.. 2020. 7. 14.
for ...of문 / for ...in문 for문은 단순한 반복과 증감문에 의한 연산으로 인덱스 값을 조회하는것 말고도 조금 다른 방법으로 사용할 수 있습니다. for ...of문과 for ...in문이 이에 해당합니다. for ...of문 for ...of문은 반복가능한 (iterable한, 순서성이 있는) 타입의 value를 순회할 때 사용됩니다. 대표적으로 문자열, 배열 등이 있습니다. for문처럼 사용하되 조건문과 증감문이 없는것이 특징입니다. let str = '안녕하세요'; let arr = [5,4,3,2,1]; for (let i of str) { console.log(i) } // 안 // 녕 // 하 // 세 // 요 for (let i of arr) { console.log(i) } // 5 // 4 // 3 // 2 // .. 2020. 7. 14.
반복문 - for while문 의 단점 while문은 조건문을 충족하지 못할 때, 또는 break구문을 만나면 멈추게 됩니다. 이때 조건문을 의도적으로 충족시키지 않게 하기 위해서 3번만 반복한다고 하면 변수를 숫자로 (보통 0) 선언해주고 body부분에 이 변수의 값을 1씩 증가시키게 하는 구문이 있어야 합니다. let i = 0 while (i < 3) { console.log('hi') i += 1 } 하지만 변수 i는 반복문에서 쓰이는 용도 외에 반복문 밖에서 사용할 가치가 없습니다. 이때 굳이 while문을 사용하기보다는 for문을 사용하는것이 합리적입니다. (꼭 for문 만을 사용하는 것이 정답은 아닙니다. for문으로 쓸수 있는것은 while로 쓸수 있으며, 반대의 경우도 마찬가지 입니다.) for문 for문.. 2020. 7. 13.
반복문 - while 같은 (또는 유사한) 코드를 반복할때 어떻게 해야할까요? 단순하게 생각해서 같은 코드를 여러번 써주면 됩니다. 아니면 함수로 만들어서 함수를 여러번 호출하면 되겠군요. 100번 반복하고 싶으면 함수호출을 위하여 코드작성을 100번 해주시면 됩니다. 1000번 반복하고 싶다면 동일 코드를 1000번 작성해주시면... 뭔가 이상하죠? 이럴때 우리는 반복문을 사용하게 되면 매우 편하게 반복시킬 수 있습니다. while문 while은 body(반복할 부분)에 대해서 '무 한 반 복' 합니다. 하지만 break구문을 만나거나 while의 조건문이 false가 되는 순간 멈추게 됩니다. while의 사용법은 아래와 같습니다. while (조건문) { body } // 조건비교 -> true // body 실행 //.. 2020. 7. 13.
객체 - Object 객체..? javascript에서 객체는 키와 값이 쌍을 이루는 형태로 저장되는 타입을 의미합니다. 배열은 값이 인덱스 순서에 맞게 저장된다면, 객체는 값이 키에 저장되는것이고 이는 순서성이 보장되지 않습니다. 객체의 생성방법 객체 역시 생성할수 있는 방법이 많지만 보편적인 방법만 알아보기로 하죠. 배열은 어떻게 만들었었나요? 대괄호로 value들을 감싸주었습니다. 객체는 대괄호대신 중괄호 { } 를 사용해서 만들수 있습니다. 다만 배열과 다른점은 순서성이 없기 때문에 키를 같이 적어줘야 하는데, 표기는 다음과 같습니다. // {key:value, key2:value2, key3:value3} let obj = {name : 'Dae-seong Hwang', age: 26}; // 오브젝트를 생성하면서 .. 2020. 7. 13.
배열 - Array 주의! Python의 numpy.array와는 연산,기능 모두 다르기때문에 유의할것. 굳이 비슷한걸 찾자면 Python에선 list와 유사하다. 배열이란 어떤 값들을 순서가 있게 담은 것 여기서 값은 문자열(String), 숫자(Number), 배열(Array), 객체(Object)등등 이 외에도 undefined,null등등 모든것들이 들어올 수 있다. 순서가 있다구요..? 배열은 순서가 보장되는 값입니다. 배열에 담긴 하나하나의 값은 요소(element)라고 부르고, 배열의 순서를 인덱스(index)라고 부르죠. 우리가 생각하는 순서와 동일합니다. 다만 1부터가 아닌 0부터 시작한다는점에는 유의해야 합니다. let arr = [1,2,3,4,5] // 여기서 3번째 값인 3은 2번째 인덱스(index.. 2020. 7. 12.
함수의 반환값 - return function hi() { console.log('hi~') } hi() // hi~ 위 함수의 반환값은 어떻게 될까요..? console.log(hi()) // hi~ // undefiend 자칫하면 hi~ 라고 출력된것이 hi함수를 호출한 반환값처럼 보일수 있으나 함수가 호출되고 내부에서 작동한것입니다. hi()라는 값 자체는 undefined가 되었네요. 더 정확히 알아보기 위해서 변수에 값을 넣어줍시다. function hi() { console.log('hi~') } let a = hi() // hi~ console.log(a) // undeifined 모든 함수에는 반환값이라는 것이 있습니다. 실행된 자기자신이 그 값이 되는거죠. 함수 내에서 반환값을 정의 해주지 않는다면 기본값은 undef.. 2020. 7. 10.
함수 - function 수학에서의 함수 $f_{(x)}=3x^2 + x + 1$ 그래프를 그리지 않을거고 편미분을해 기울기를 구하지 않을거니까 트라우마 때문에 울렁거리는 속을 잠시 진정시키고 이 역할이 무엇일지 봅시다. 미리 x에 대한 동작을 정의 해놓은 것이네요. 이제 함수에 3을 넣어준다면..? $f_{(3)} = 3\times3^2+3+1=31$ 31이라는 값을 얻어낼 수 있습니다. 입력값에 대한 출력값을 사전에 정의하는 거구나 프로그래밍 언어 - 함수 수학에서의 함수와 큰 차이가 없습니다. 다만 입력값이 없을수도 출력값이 없을수도 있죠. 대부분의 프로그래밍 언어에서 (특정언어만 해당하는것이 아닙니다) 함수는 사전에 어떠한 동작을 정의하는 것입니다. 사용법 자바스크립트에서 함수를 만드는 방법은 한가지가 아니지만 가장 일반.. 2020. 7. 10.

티스토리툴바