본문 바로가기

프로그래밍105

JavaScript 기초 : 자료형 업그레이드 4. 기본형과 참조형 4. 자료형 자료형은 크게 기본형과 참조형으로 나뉜다. 기본형은 Primitve Type 이라고 부르며 참조형은 Reference Type이라고 부른다. 기본형은 말 그대로 기본이다. 숫자, 문자열, 불린, null, undefined 처럼 한 개의 값을 가진 요소들이다. 참조형은 객체와 배열을 말한다. 여러 값들이 묶여 있는 것이며 자바스크립트에서 매우 중요하다. 기본형과 참조형 각각을 살펴보자! 4-1. 기본형(Primitive Type) 숫자 문자열 불린 null undefined 프로그래밍을 할 때는 언어에 상관 없이 어떤 값을 사용할 때 보통 변수에 할당하여 사용한다. (특별한 경우를 제외하면) 변수에 기본형 값을 할당하면 해당 이름을 가진 변수 상자에 그 값을 넣어준다고 생각할 수 있다. 예를.. 2020. 9. 15.
JavaScript 기초 : 자료형 업그레이드 3. 문자열 - slice메소드 3. 문자열 지난 글에서는 자바스크립트에서는 숫자형을 객체로 다루었고 Math객체와 다양한 메소드들을 살펴보았다. JavaScript 기초 : 자료형 업그레이드 2. Math 객체 문자열 또한 객체처럼 다룰 수 있다. 문자열은 배열과 비슷한 점이 많다. length프로퍼티를 이용해서 문자열의 길이를 알 수 있고 배열에서 사용하는 index와 대괄호 표기법을 이용해 문자열의 글자 하나하나에 접근할 수 있다. 또한 index[] 와 같은 결과를 내기 위해 charAt이라는 메소드를 이용해서 문자열 글자 하나하나에 접근할 수 있다. 예시를 살펴보자. //String let myString = 'Hi Yunju'; //문자열 길이 length console.log(myString.length); //문자열 요소.. 2020. 9. 14.
JavaScript 기초 : 자료형 업그레이드 2. Math 객체 2. Math 객체 지난 글에서 봤던 Date객체처럼 JavaScript 기초 : 객체 4. Date 객체(getTime()) - D-day계산기 만들기! Math객체도 있다. Math 객체는 Math.--- 이렇게 써서 사용하면 된다. Math 객체의 다양한 종류를 살펴보자. 2-1. 절대값(Absolute Number) 절대값은 무슨 수이든 '양수'로 바꿔주는 것이다. Math.abs(-10); 이런식으로 적으면 양수가 된다. //절댓값(abs) console.log(Math.abs(-11)); console.log(Math.abs(11)); 2-2.최댓값(Maximum) Math.max(2,3,4,-1); 이렇게 파라미터에 여러 값을 넣어주면 그 중 가장 큰 값이 리턴된다. //최댓값(max) co.. 2020. 9. 14.
JavaScript 기초 : 배열 4. for ...of 반복문 4. for ... of 반복문 for ...of를 정리하기 전 먼저 예시를 가져왔다. for of 를 어떻게 쓰는지 보고 for of에 대해 정리해보자. 투표 집계 도우미 프로그램이다. 여기서 voteCounter는 후보별 득표수를 알려주는 객체로 만들것이다. for of 문을 사용해서 이름이 votes배열에 있는 경우 이름을 나열해 줄거다. 이 때 이름이 voteCounter 객체에 있다면 coteCounter[name], 즉 프로퍼티 값을 1 증가시킬거고 이름이 voteCounter 객체에 없다면 voteCounter[name] 프로퍼티 값은 그대로 1이다. // 투표 결과 리스트 let votes = ['조윤주', '조윤주', '조윤주', '유재석', '유재석', '유재석', '조윤주', '유재석.. 2020. 9. 10.
JavaScript 기초 : 배열 3. 메서드 - indexOf, lasindexOf, includes, reverse 사용법 3. 다양한 메서드 3-1. 배열에서 특정 값 찾기 (indexOf/ lastindexOf) indexOf(item) 1.만약 item이 배열에 포함되어 있다면 item이 있는 인덱스가 리턴된다. 2. 포함되어 있지 않다면 -1이 리턴된다. 3. 여러 번 포함되어 있다면, 처음 발견된 인덱스가 리턴된다. lastindexOf(item) indexOf랑 똑같은데 탐색을 뒤에서부터 한다. 1.만약 item이 배열에 포함되어 있다면 item이 있는 인덱스가 리턴된다. 2. 포함되어 있지 않다면 -1이 리턴된다. 3. 여러 번 포함되어 있다면, 처음 발견된 인덱스가 리턴된다. let brands = ['snu', 'ku', 'yu', 'ku']; console.log(brands.indexOf('snu')); .. 2020. 9. 10.
JavaScript 기초 : 배열 3. 배열 메소드 - shift, pop, unshift, push 3. 배열 메소드2- shift, pop, unshift, push splice 사용이 만능같지만 오히려 귀찮을 때가 있다. 자바스크립트에서 제공하는 메소드를 사용하면 배열의 첫 요소 삭제, 끝 요소 삭제, 첫 요소 값 추가, 끝 요소 값 추가를 더 짧은 코드로 쓸 수 있다. 아래 코드를 통해 예시를 살펴보자! 배열의 첫 요소를 삭제하는 매소드는 shift다. 배열의 마지막 요소를 삭제하는 메소드는 pop이다. 배열의 첫 요소로 값을 추가하는 메소드는 unshift다. 배열의 마지막 요소로 값을 추가하는 메소드는 push이다. let fruits = ['딸기', '당근', '수박', '참외', '메론']; //배열의 첫 오소를 삭제 : shift() fruits.shift(); console.log(fr.. 2020. 9. 10.
JavaScript 기초 : 배열 2. 배열 메소드- splice사용법 2. 배열 메소드 배열을 좀 더 안전하고 효과적으로 다루기 위해서는 배열의 메소드를 이용하는 것이 좋다. 우선 배열의 요소를 삭제하는 코드를 보자! let members = ['유재석', '박명수', '정준하', '정형돈', '하하', '노홍철']; //요소 삭제 delete members[4]; console.log(members); //완벽히 삭제가 안된다. 이 경우 하하가 삭제되긴 했는데 empty라고 뜨고 인덱스도 6 그대로이다. 그럼 이제 splice메소드를 사용해서 요소를 삭제해보자. 2-1. splice를 사용하여 요소를 삭제 splice메소드는 배열.splice(index번호) 이렇게 작성하는데 TIP 대괄호가 아니라 ( ) 그냥 괄호를 쓴다! (헷갈림 주의) 그런데! 그냥 index번호만.. 2020. 9. 10.
JavaScript 기초 : 배열 1. 배열 1. 배열(Array) 배열이란 무엇일까? 배열은 객체 처럼 사용하는데 프로퍼티 네임 없이 프로퍼티 값만 쓴다고 생각하면 된다. 배열 안에 있는 값들은 '요소(element)'라고 부른다. 객체와는 다르게 단순히 여러 값들을 쉼표로 구분해서 대괄호로 담고 있다. 하지만 type of 연산자로 배열을 확인해보면!!! 배열도 객체이다. 즉 배열도 객체의 한 종류인 것이다~! 그럼 배열을 표현해보자! //배열(Array) let snuecourse = [ '교육용프앱개발', '최신정보기기세미나', '이러닝연구세미나', ]; 대괄호 안에 각 요소별로 순서가 매겨진다. 순서는 index라고 한다. index가 객체의 프로퍼티 네임 역할을 한다. indexing 인덱스를 통해 배열의 요소에 접근하는 방법을 inde.. 2020. 9. 10.
JavsScript 기초 : 객체 3. for~ in 반복문 3. for ~ in 반복문 for in 반복문은 객체 안에 있는 프로퍼티들을 가지고 반복적인 동작을 수행할 때 사용한다. 객체의 프로퍼티 네임을 가져오는 반복이기 때문에 일반적인 for문으로는 대체할 수 없다! 어떻게 쓰는지 보자! //for in for (변수 in 객체) { 동작부분 } 이처럼 특정한 변수를 만들고 반복할 객체를 넣어준다. 그럼 객체의 프로퍼티 네임이 변수에 할당되고 객체의 프로퍼티 개수만큼 반복하여 동작한다. 3-1. for ~ in 반복문 기초 아주 간단한 예시를 보자. joSW라는 객체를 만들고 for in 문으로 반복하는 코드이다. //for in let joSW = { name: 'yunju', bornYear: 2020, isVerynice: true, bestCourse.. 2020. 9. 9.
JavaScript 기초 : 객체 2. 객체와 메소드 2. 객체와 메소드 연관된 여러 값을 하나로 묶고 싶을 때는 객체를 사용했다. 여러 함수를 하나로 묶고 싶은 경우에도 객체를 사용한다. 객체의 프로퍼티에는 어떤 자료형이든 저장할 수 있기 때문에 프로터피 값으로 함수를 저장해주면 된다. 이런 함수를 메소드 라고 한다!! 예시를 보자. greeting라는 변수가 있다. let greetings = { }; 이제 중 괄호 안에 메소드를 써보자. sayHello : function () { }, sayBye : function() { } key : value 값에 key는 그대로 적고 value에는 함수를 적는 것이다. //매소드(Method) let greetings = { sayHello: function () { console.log('Hello'); }.. 2020. 9. 9.

티스토리툴바