무작정 개발.Vlog

[node.js] 배열, 콜백 함수, prototype 객체 생성

by 무작정 개발
반응형
2022.03.31(68일 차)

 

node.js
node.js

 

 

배열에 요소(값) 추가 및 삭제

 

배열(Array)에는 다음과 같은 메서드가 포함되어 있어 그 요소 값을 확인하거나 추가 및 삭제 가능

속성 / 메서드 설명
push(object) 배열의 끝에 요소(데이터) 추가
pop() 배열의 끝에 요소 삭제
unshift() 배열의 맨 앞에 요소 추가
shift() 배열의 만 앞에 요소 삭제
splice(index, removeCount, [Object] 여러 데이터 추가/삭제
slice(index, copyCount) 배열을 잘라내서 새로운 배열 객체를 만듬

 

 

(1) - push(Object)

  • 배열의 끝에 요소(데이터) 추가
// push(Object) 
var users = [{name:"배수지",age:27},{name:"유인나",age:40}];

users.push({name:"박신혜",age:33});

console.log("데이터 갯수:" + users.length); //데이터 갯수:3
console.log(users[0].name); //배수지
console.log(users[1].name); //유인나
console.log(users[2].name); //박신혜 => 배열 맨 마지막에 데이터가 들어간다.

console.log("-------------------");

//데이터를 한꺼번에 출력할려면
console.dir(users); //json형태로 출력

콘솔 결과
콘솔 결과

 

(2) - push()를 사용해서 배열에 함수 추가하기

//배열에 함수 추가
var add = function(a,b) {
	return a + b;
}

users.push(add);
console.log(users[2](10,20)); //30 추가

 

(3) - for문, forEach문을 사용해서 배열 출력

console.log("-------------------");
for(var i=0; i<users.length; i++) {
	console.log(users[i].name);
}
console.log("-------------------");

users.forEach(function(item,index) {
	console.log(index + ":" + item.name + ":" + item.age);
});

콘솔 결과
콘솔 결과

 

(4) - splice(index, removeCount, [Object]) - 삭제

//splice
users.splice(0,1); //index 0에서 1개의 데이터
for(var i=0; i<users.length; i++) {
	console.log(users[i].name); //배수지가 삭제되고, 유인나, 박신혜 만 출력
}

 

(5) - pop() - 맨 뒤 요소 삭제

users.pop();

 

 

배열 전체 예제 소스 코드

 

test5.js

/*
배열 만들고 요소 추가하기

push() : 마지막에 데이터 추가
pop() : 마지막 데이터 삭제
unshift() : 맨앞에 데이터 추가
shift() : 맨앞에 데이터 삭제
splice() : 여러 데이터 추가/삭제
slice() : 잘라내서 새로운 배열 만들기
 */

// push(Object) 
var users = [{name:"배수지",age:27},{name:"유인나",age:40}];

users.push({name:"박신혜",age:33});

console.log("데이터 갯수:" + users.length); //데이터 갯수:3
console.log(users[0].name); //배수지
console.log(users[1].name); //유인나
console.log(users[2].name); //박신혜 => 배열 맨 마지막에 데이터가 들어간다.

console.log("-------------------");

//데이터를 한꺼번에 출력할려면
console.dir(users); //json형태로 출력


console.log("-------------------");
for(var i=0; i<users.length; i++) {
	console.log(users[i].name);
}
console.log("-------------------");

users.forEach(function(item,index) {
	console.log(index + ":" + item.name + ":" + item.age);
});

console.log("-------------------");

//splice
users.splice(0,1); //index 0에서 1개의 데이터
for(var i=0; i<users.length; i++) {
	console.log(users[i].name); //배수지가 삭제되고, 유인나, 박신혜 만 출력
}
console.log("-------------------");

//배열에 함수 추가
var add = function(a,b) {
	return a + b;
}

users.push(add);
console.log(users[2](10,20)); //30 추가

console.log("-------------------");

for(var i=0; i<users.length; i++) {
	console.log(users[i].name); 
}

console.log("-------------------");

//데이터 추가
users.push({name:"이효리", age:40});
users.push({name:"정인성", age:30});
for(var i=0; i<users.length; i++) {
	console.log(users[i].name); 
}

console.log("-------------------");

//마지막 데이터 삭제
users.pop();
for(var i=0; i<users.length; i++) {
	console.log(users[i].name);  //마지막 데이터인 정인성 삭제
}

console.log("-------------------");

//첫번째 데이터 삭제
users.shift();
for(var i=0; i<users.length; i++) {
	console.log(users[i].name);  //첫번째 데이터 삭제 = 유인나
}

console.log("-------------------");

//첫번째에 데이터 추가하기
users.unshift({name:"김지현", age:30});

for(var i=0; i<users.length; i++) {
	console.log(users[i].name);  //첫번째에 김지현 추가
}

console.log("-------------------");

//중간 데이터 삭제
delete users[1];

console.log(users); //데이터는 지워지는데 공간은 남아있다.

console.log("-------------------");

//index1에 추가 - splice로 추가
users.splice(1,0,{name:"빅마마", age:40});
console.log(users);

console.log("-------------------");

//splice로 삭제 - delete로 삭제하면 공간이 남아있고 그 공간에 데이터 추가를 못한다.
users.splice(2,1); // 그래서 splice로 삭제해주는 게 좋다.
console.log(users);

console.log("-------------------");

//slice : 잘라내서 새로운 배열 만들기
console.log(users.length); //현재 배열의 길이는 4

var users2 = users.slice(1,3); // 3-1 /1에서부터 2개 / 1을 제외하고 2,3을 출력
console.log(users);
console.log("-------------------");
console.log(users2);

 


 

콜백 함수 (CallBack function)

 

콜백 함수는 node.js의 가장 핵심적인 부분이다. + 비동기 방식의 함수

 

(1) - 함수 안에 콜백 함수가 들어가 있는 상태

function add(a,b,callback) {
	var result = a + b;
	callback(result);
}

add(10,20,function(result) {
	console.log(result); //30
});

 

Prototype 객체 만들기

 

test7.js

/*
 prototype 객체 만들기 : 기존 객체를 복하해서 새로운 객체를 만듦
 
 - 객체 원형인 프로토 타입을 이용해서 새로운 객체를 만들어 낸다.
 - 이렇게 생성된 객체 또한 다른 객체의 원형이 될 수 있다.
 
 
 */

// 객체 생성과 동시에 초기화 (java의 생성자와 동일한 개념)
function Person(name,age) {
	this.name = name;
	this.age = age;
}

//프로토 타입은 반드시 객체.protype 식으로 적어줘야 한다.
Person.prototype.walk = function(speed) {
	
	if(speed>30) {
		console.log(speed + "km 속도로 뛰는중~");
		return
	}
	
	console.log(speed + "km 속도로 걷는중~");
	
}

//프로토 타입은 반드시 객체를 생성하고, 객체를 통해 접근 해야 한다.
var person1 = new Person("수지",27); 
var person2 = new Person("인나",40);

console.log(person1.name + "가 걸어가고있다.");
person1.walk(10);

console.log(person2.name + "가 뛰어가고있다.");
person2.walk(50);

test7.js 출력 결과
test7.js 출력 결과

 

 

반응형

블로그의 정보

무작정 개발

무작정 개발

활동하기