에이블디 공식 블로그

안녕하세요 여러분! 에이블디입니다! 이번 시간에는 배열이나 문자열에서 특정 배열 값이나 문자열과 일치하는 값이있는 첫 주소값(인덱스)을 찾아주는 indexOf에 대해 배워보려 합니다! indedOf는 배열이나 문자열에서 특정 배열값이나 문자열을 (serchValue) 찾고 검색된 일치하는 값이 있는 첫 번째 주소 값을 반환합니다. 두 가지 방법으로 사용할 수 있는데, 첫째로 indexOf 인수에 찾고자 하는 배열 값이나 문자열은 필수로 입력하셔야 합니다. 두 번째로 포지션 값을 함께 입력할 수 있는데 이 값은 옵션 값으로써 인수에 포지션 값을 입력하지 않으면 기본값은 0이 되는데요 포지션 값은 찾고자 하는 배열 값이나 문자열을 찾기 시작할 위치를 나타내게 됩니다. indexOf에서는 찾고자 하는 배열이나..

안녕하세요 여러분! 에이블디입니다! 이번 시간에는 지난 시간에 이어 배열에서 사용할 수 있는 함수에 대해 조금 더 알아보도록 하겠습니다! 이번 시간에 배울 함수는 slice함수인데요! slice 함수는 배열의 시작 인덱스와 끝 인덱스를 지정해 그 사이의 데이터를 추출합니다. 지난 시간에 배웠던 splice 함수처럼 slice 함수에서도 배열의 시작 인덱스만 지정할 경우 시작 인덱스부터 배열의 끝까지 데이터를 추출합니다. 그리고 가장 중요한 특징이 있는데요! splice 함수를 사용해서 배열의 데이터를 추출했을 때는 배열이 변경되지만, slice 함수는 배열의 데이터를 추출해도 배열이 변경되지 않는 특징을 가지고 있습니다! 그럼 코드를 직접 작성해 보면서 slice에 대해 알아보도록 할게요! 배열 관련 함..

안녕하세요 여러분! 에이블디입니다! 이번 시간에는 지난 시간에 이어서 함수에서 사용할 수 있는 함수중 하나인 splice에 대해 알아보겠습니다! 지난 시간에 배웠던, push, unshift, pop, shift 함수들은 배열의 맨 앞이나 맨 뒤에 데이터를 추가하거나 추출하는 함수였던 것 기억하시죠? 그렇다면 배열의 중간 부분에 데이터를 추가하거나 삭제하고 싶을 때가 있겠죠? 그리고 2개 이상의 데이터를 추가하거나 삭제하고 싶을 때도 있을 겁니다. 이럴 때 사용하는 것이 splice 함수입니다! splice 함수는 () 괄호 안에 들어 있는 인수에 따라 일정 구간의 데이터를 삭제하고 새로운 데이터를 추가하는 함수인데요, splice 함수를 실행하면 삭제한 구간의 요소들로 이루어진 새로운 배열이 만들어집니..

안녕하세요 여러분! 에이블디입니다! 이번 시간에는 지난 시간에 이어 배열에서 사용할 수 있는 함수에 대해 조금 더 알아보도록 할게요! 코드를 작성하다 보면 배열에 담긴 데이터를 삭제해야 할 일이 생길 때도 있는데요, 이번 시간에는 배열에 담긴 데이터를 삭제할 수 있는 pop과 shift라는 함수에 대해 알아보려고 합니다! 배열에서 맨 뒤에 있는 데이터를 추출할 때는 pop함수를 사용하고요, 배열의 맨 앞에 있는 데이터를 추출할 때는 shift 함수를 사용합니다. 배열에서 데이터를 추출하면 해당 데이터가 배열에서 빠지면서 배열이 수정되기 때문에 배열에서 데이터를 삭제할 때는 추출 함수를 사용합니다. 그럼 간단하게 코드를 직접 짜 보면서 두 함수에 대해 이해해 보도록 할까요? 먼저 pop 함수를 먼저 사용해..

안녕하세요 여러분! 에이블디입니다! 이번 시간에는 지난 시간에 이어 배열에서 사용할 수 있는 함수에 대해 조금 더 알아보도록 하겠습니다! 이번 시간에 배울 함수는 push와 unshift 함수인데요, 코드를 작성하다 보면 기존 배열에 새로운 값을 추가해야 할 상황이 있을 수 있겠죠? 이때 사용할 수 있는 함수들입니다! push는 기존 배열의 맨 끝에 새로운 값을 추가할 때 사용하고요, unshift는 기존 배열의 맨 앞에 값을 추가할 때 사용할 수 있습니다. 지난 시간에 만들었던 hyundai 배열을 사용하여 push와 unshift 함수를 사용하여 실습해 보도록 하겠습니다! 먼저 push 함수를 사용하여 기존의 hyundai 배열의 맨 끝에 g70, g80, g90을 추가해 보도록 하겠습니다! 코드는 ..

안녕하세요 여러분! 에이블디 입니다! 이번 시간에는 지난 시간에 이어 Array 객체에서 사용할 수 있는 함수들에 대해 알아보려 해요! 코드를 작성하다 보면 배열에 값을 추가하거나, 삭제하거나, 아니면 배열끼리 값을 합친다던가 하는 등의 상황이 발생하는데요, 이번 시간에는 concat 함수와 join 함수에 대해 알아보겠습니다. 먼저 concat 함수에 대해 알아보도록 하겠습니다! concat 함수는 기존의 배열에 또 다른 배열이나 값을 합쳐서 새로운 배열을 만드는 함수입니다. 예를 들어 hyundai 배열과 kia 배열이 있을 때 concat 함수를 사용해 두 개의 배열을 합쳐서 새로운 배열을 만들 수 있습니다. 예시 코드는 다음과 같습니다. var hyundai = ["avante", "sonata"..

안녕하세요 여러분! 에이블디 입니다! 이번 시간에는 지난 시간에 이어 내장 객체 중 하나인 Array(배열) 객체에 대해 알아보도록 하겠습니다! 배열은 자바스크립트에서 자주 사용하는 자료형이기 때문에 자바스크립트 안에 미리 프로토타입 객체로 만들어져 있는데요, 이 안에는 배열에 활용하는 많은 속성과 함수가 미리 정의되어 있습니다. Array 객체의 인스턴스로 배열을 만들면 Array 객체 안의 함수를 사용할 수 있기 때문에 프로그램 만들기가 한결 편해집니다! 그럼 지금부터 Array 객체에 대해 알아보도록 할게요! 배열에 대해서는 자바스크립트의 #2번 글에서 잠시 다루었었죠? 이때 배열을 왜 써야 하는지도 우리는 배웠습니다! 기억이 나지 않으시는 분은 아래의 글에서 다시 한번 공부하고 와주세요! http..

안녕하세요 여러분 에이블디 입니다! 이번 시간에는 생성자를 사용해 객체를 만드는 방법에 대해 알아보겠습니다! 리터럴을 사용해 객체를 만들면 객체를 쉽게 만들 수 있습니다. 그런데 리터럴을 사용해 만든 객체는 정해진 값을 가진 객체를 한 번만 만들게 되는데요, 개발을 하다 보면 유사한 객체를 여러 개 만들어야 할 때가 생기곤 합니다. 하지만 리터럴 객체를 사용하게 되면 매번 객체와 똑같은 속성과 함수를 입력하고 객체마다 그 값을 다르게 넣어 새롭게 객체를 만들어야 합니다. 이럴 때 항상 필요한 속성과 함수는 틀처럼 미리 만들어 두고, 필요할 때마다 그 틀을 복제한 인스턴스를 만들어 객체의 정보 값을 담아 객체를 만들 수 있습니다. 바로 생성자를 사용해 함수를 만들어 객체를 만들면 되는데요, 생성자를 사용한..

안녕하세요 여러분! 에이블디 입니다! 이번 시간에는 리터럴(Literal)에 대해 알아보겠습니다! 지난 시간에 이어 객체를 생성하는 방법에 대해 더 알아볼 텐데요, 오늘은 리터럴 표기법을 사용해 객체를 만들어보는 방법을 배워볼게요! 리터럴이란 프로그래밍에서 자료를 표기하는 방식을 말하는데요, 자바스크립트뿐만 아니라 프로그래밍 언어 전체에서 사용하는 언어입니다. 리터럴을 사용한다는 것은 변수를 선언하면서 동시에 값을 지정해 주는 방식입니다. 지금까지 우리가 공부하면서도 많이 사용했었는데요, 다음과 같이 변수를 선언하면서 동시에 값을 지정하는 것이 바로 리터럴 표기법입니다. var number = 1; 그럼 리터럴을 사용해서 객체를 생성한다는 것은 객체를 선언하면서 동시에 값을 지정해 주는 것이겠죠? 리터럴..

안녕하세요 에이블디 입니다! 이번 시간에는 프로토타입과 인스턴스에 대해 알아보려고 해요! 여러분 혹시 자바의 클래스라는 개념을 들어보셨나요? 객체지향 언어의 가장 최소 단위가 되는 것이 클래스인데요, 하지만 자바스크립트는 클래스라는 개념이 없습니다. (ES6에서 클래스의 개념이 생기긴 하지만 자바의 클래스와는 조금 성향이 다릅니다. 자바스크립트에서 제공하는 클래스는 일반 함수보다 좀 더 특별한 함수정도로 생각할 수 있겠네요. 자바스크립트의 클래스는 다른 포스팅에서 다루도록 하겠습니다.) 대신 기존의 객체를 복사하여 새로운 객체를 생성하는데요, 자바스크립트에서는 기본 데이터 타입을 제외한 모든 것이 객체입니다. 객체가 만들어지기 위해서는 자신을 만드는 데 사용된 원형인 프로토타입 객체를 이용하여 객체를 만..