본문 바로가기

JavaScript30

[Javascript]기초 메소드(Number / String / Array) 메소드란 자바스크립트 내에 내장되어 있는 객체(내장 객체)를 의미한다. Number / String / Array 등 각각에 적용되는 메소드 역시 따로 존재한다. 첫번째로 Number Method에 대해 알아보자. 메소드에는 수많은 종류가 있지만, 그나마 자주 쓰이는 메소드는 다음 표와 같다. Number(문자열) 숫자로 변환 Math.abs(숫자) 숫자의 절대값을 반환 Math.max(숫자1, 숫자2, 숫자3 ...) 숫자 중 가장 큰 값을 반환 Math.min(숫자1, 숫자2, 숫자3 ...) 숫자 중 가장 작은 값을 반환 Math.pow(숫자, 제곱값) 숫자의 거듭제곱값을 반환 Math.random() 0~1 사이의 난수를 반환 Math.round(숫자) 소수점 첫째 자리에서 반올림 하여 정수를 반.. 2020. 4. 14.
16일차 초보개발자 TIL 지난 시간 동안 실제 앱이나 웹이 작동되는 형태를 구현하기 위한 twitter 과제 진행하였다. 과제 이후 심화과정으로 넘어가 callback에 대한 용어 이해 부분을 익히는 시간을 가졌다. 우선 twitter과제를 통해서 실제 앱이나 웹이 어떠한 방식으로 작동되는지에 대한 부분을 익히는 시간이었다. 단순하게 user와 comment를 입력하여 화면에 나타내는 것은 물론이고, 화면상의 comment에 대한 새로고침 버튼을 눌렀을때 DATA에 저장되어 있는 내용을 실시간으로 표시하여 나타내게 하는 방법을 배웠다. 거기다가 같은 이름의 user가 작성한 comment를 확인하기 위해 user를 클릭하였을떄 해당 user만 작성한 글이 나오도록 나타내고, 다시 되돌아가 원래의 형태로 돌아가는 방식을 구현하였다.. 2020. 4. 13.
[Javascaript]배열과 객체 배열이란 [] (대괄호) 안에서 나열되어있는 형태를 말한다. 배열은 기본적으로 let array = [ 1, 2, alpha, beta]; 의 형태를 지닌다. 배열의 경우 안에 있는 내용을 Element(요소)라고 하며, 각 요소의 위치를 index라고 한다. 주의할 점은 index가 1 이 아닌 0 일때 부터 시작한다는 점이다. array[0] // 1 array[3] // beta 반복문인 for문을 통해서 각 인덱스의 값을 호출할 수 있는데 for(let i = 0; i < array.length; i++){ console.log(array[i]) } // 1 , 2, alpha, beta 로 나타낼 수 있다. 그리고 array의 빈객체를 나타내고 싶을 때는 array = [] ; [] === ar.. 2020. 4. 8.
13일차 초보개발자 TIL 오늘은 HTML 과 CSS에 관해 익히는 시간을 가졌다. 우리가 흔히 보는 웹사이트나 모바일앱에서 나타나는 모양을 구현하기 위해 사용한다. HTML의 경우 웹사이트를 제작할때의 기본 구조를 만들어내는 것이고 CSS는 HTML을 꾸며주는 역할을 한다고 볼 수 있다. twittler과제를 하면서 비슷한 모양으로 구현하기 위해 어떤 요소가 있는지 공부하고, 실제 비슷한 모양으로 만들어내는 과정을 익히는 시간이었다. 우선 처음에 전체적으로 구성을 어떻게 할 것인지 와이어프레임을 우선적으로 짜고, 거기서 실제 작동되지는 않더라도 보여지는 모양을 그대로 구현하는 것 목업작업을 하였다. 처음 아무것도 없이 시작하려니 막막하였지만, 페어와 함께 하나하나씩 구현해 나가고, 만들어진 과제를 꾸며가면서 우리가 생각하는 웹사.. 2020. 4. 8.
11일차 초보개발자 TIL 어느덧 자바스크립트를 본격적으로 배운지 10일이 넘었다. 아직까지 git, reduce함수 등 정확히 이해하지 못하는 부분이 많았다. 이번에 testbuilder라는 과제를 진행하면서 새로운 것을 또 익히다 보니 점점 머리가 복잡해지는 느낌이었다. 테스트 주도 개발을 통해 test Framework에 관해서 배웠었다. test framework가 무엇인지, 유닛 테스트와 테스트 주도 개발의 차이는 무엇인지, Mocha와 Chai에서 사용되는 것이 무엇인지를 익히는 과정이었다. 사실 아직까지 Mocha와 Chai가 정확히 어떤 것인이 이해는 하지 못하였다. 그저 개발 과정에서 테스트에 사용되는 툴로만 이해하였다. 하지만 전반적으로 테스트 주도 개발을 통해 개발과정에서의 방향성을 제시해주고 큰틀을 짜주는 부.. 2020. 4. 6.
[Javascript]함수 자바스크립트에서 함수란 지시사항의 묶음으로써 입력 => 함수 => 출력 의 과정을 거치게 된다. 수학식에서 함수 f(x) = x * 2 라고 가정하면 f(2) = 4 f(3) = 6 의 결과 값이 나올 것이다. 함수는 굳이 수학식이 아니더라도 가능하다. 수학식에서는 f(x) 로 표기 되지만 Javascript에서는 함수이름(입력값) 형태로 나타낸다. let length = getLength("안녕") console.log(length) // 2 함수의 선언은 두가지 형태로 할 수 있다. function = newFunction(input){ // 컴퓨터에 지시할 내용 } // (함수 선언식) let newFunction = function(input){ // 컴퓨터에 지시할 내용 } // (함수 표현식).. 2020. 4. 6.
9일차 초보개발자 TIL Javascript koans 과제를 하면서 이제까지 배웠던 내용들을 복습하였다. 배열 객체 메소드 부분을 집중적으로 리마인드 하였고, 추가적으로 Scope의 정의와 let, var, const 의 사용 범위에 대해 배우고 Closure에 대해서도 익히면서 코드를 작성하는 데 있어서 패턴에 대해서도 익혔다. 문제를 풀면서 어떤 함수나 메소드가 작동할때 어떻게 결과값이 나오는지 계속 생각하면서 범위에 따르는 결과값의 차이를 이해하게 되었다. 조금은 뭔가 코딩이라는 전체적인 개념에 대해 다가갈 수 있게 되었다고 생각한다. 2020. 4. 2.
8일차 초보개발자 개발자로써 가장 중요한 역량은 협업을 잘 하는 것이다. 개발자들이 협업을 할때 가장 많이 사용하는 도구가 git과 github 이다. 오늘 새로운 마음으로 git 과 github의 사용법에 대해 익혔다. 기본적으로 git bash를 이용하여 github에서 오픈소스로 나와있는 코드를 fork하여 내가 작업하고자 하는 곳에 git clone 명령어로 옮겨 visual studio code를 이용하여 수정한 후 다시 업로드 하는 것이다. 예전에 한번 해본적이 있어서 큰 걱정은 안했지만, 처음 하는 것보다 더 많이 헤메었다. 이전에 작업해서 commit 하고 push했던 내용이 있어서 레퍼지토리를 제거하고 새로 fork를 하여 실행하였다. 중간 중간 막히는 부분들이 많아 한참을 헤메었지만, 조금씩 github.. 2020. 4. 1.
[Javascript] 타입 변수에는 여러가지 타입이 있다. 타입의 종류에는 숫자 , 문자, 불리언, 배열, 객체, 함수, undefineded 등 이 있다. 1 + 1 = 2 typeof 2 // 'number' 1, 2, 30, 0, -3 등 수를 계산을 할 수 있는 숫자가 있다. 숫자의 경우 + - * / % 등 연산자를 사용하여 수를 계산할 수 있는 것이 특징이다. 'English' '3' '+' typeof '문자' // 'string' 'English' 'string ' '문자' '32' 등 수가 아닌 문자로 인식하는 것이 바로 문자열이다. 문자의 경후 따옴표('') 나 쌍따옴표("") 사이에 표시되며, 숫자나 연산자가 들어가더라도 문자열로 인식한다. 3 + '5' = '35' 숫자와 문자의 구분이 특히 중요한데, 숫자가.. 2020. 4. 1.

티스토리툴바