JavaScript(3)

Javascript 기초문법(7)_반복문

for문 예시

const animals = [
  { name: 'lion', size: 'big', isAggressive: true, weight: 200},
  { name: 'monkey', size: 'medium', isAggressive: true, weight: 30},
  { name: 'cat', size: 'small', isAggressive: false, weight: 10},
  { name: 'rat', size: 'small', isAggressive: false, weight: 2},
];

  for(let i = 0; i < 4; i++) {
    console.log(animals[i].name); // lion, monkey, cat, rat
  또는 
  for(let i = 0; i < animals.length; i++) {
    console.log(animals[i].name); // lion, monkey, cat, rat 
  또는
  for (let animal of animals) {
    console.log(animal);	//animals에 있는 key와 value를 animal이라는 변수에 담아서 출력 

while문 예시

let i = 0;
while(i<10){
  console.log(i);
  i++	//0,1,2....10 출력
};

★ 반복문 메서드 forEach, map, filter, reduce

const animals = [
  { name: 'lion', size: 'big', isAggressive: true, weight: 200},
  { name: 'monkey', size: 'medium', isAggressive: true, weight: 30},
  { name: 'cat', size: 'small', isAggressive: false, weight: 10},
  { name: 'rat', size: 'small', isAggressive: false, weight: 2},
];

//1. forEach : 단순한 반복문(함수에 담아서 돌려주는?)

animals.forEach(function(animal) {
  console.log(animal.weght))
});		//200, 30, 10, 2 출력

//2. map : 어떠한 배열을 다른 형태의 배열로 재생산하는 반복문
const animalsNames = animals.map(function(animal){
	return animal.name
});
console.log(animalsNames); // 0:lion, 1:monkey, 2:cat, 3:rat
또는
const animalsNames = animals.map(function(animal){
	return `Animal's name is ${animal.name} and size is ${animal.size}`
});	
//Animal's name is lion and size is big
//Animal's name is monkey and size is medium
//Animal's name is cat and size is small
//Animal's name is rat and size is small

//3. filter : 배열 안에서 특정 조건을 가진 아이템만 뽑아내는 반복문
const smallAnimals = animals.filter(function(item){
  return item.size === 'small';
});
console.log(smallAnimals);	//size가 small에 해당하는 item만 출력
//0: name: cat, size:small ...
//1: name: rat, size:small ...   

//4. reduce : 배열 안에 값들의 합을 구할 때(그 외에도 다양하게 활용 가능)
const totalWeight = animals.reduce(function(acc,cur){
  return acc + cur.weight;
},0);	//초기값을 0으로 지정해줌 

console.log(totalWeight);  //242 출력

reduce설명)
const numbers = [1,10,11,23,444];

const total = number.reduce(function(acc,cur)){ 
           //acc는 더해진 값, cur은 앞에 더해진 값+현재값, 다시 acc에는 더해진 값이 남음
console.log(acc,cur);
return acc + cur

console.log(total); // 1+10, 11+11, 22+23, 45+444, 489 출력

Javascript 기초문법(8)_조건문

if문 예시

const animals = [
  { name: 'lion', size: 'big', isAggressive: true, weight: 200},
  { name: 'monkey', size: 'medium', isAggressive: true, weight: 30},
  { name: 'cat', size: 'small', isAggressive: false, weight: 10},
  { name: 'rat', size: 'small', isAggressive: false, weight: 2},
];

const animal = "lion";
if (animal === "lion"){
  console.log("lion like food is meat");
}else if (animal === "cat"){
  console.log("cat like food is jelly");
else {
   console.log("not like food");
});		
//animal이 lion이면 lion like food is meat 출력
//animal이 cat이면 cat like food is jelly 출력
//animal에 아무것도 해당하지 않으면 not like food 출력 

swich문 예시

const animals = [
  { name: 'lion', size: 'big', isAggressive: true, weight: 200},
  { name: 'monkey', size: 'medium', isAggressive: true, weight: 30},
  { name: 'cat', size: 'small', isAggressive: false, weight: 10},
  { name: 'rat', size: 'small', isAggressive: false, weight: 2},
];

const animal = 'lion';

switch (animal) {
  case 'lion' :
      console.log("animal is lion");
      break;
  case 'monkey' : 
      console.log("animal is monkey");
      break;
  default:
      console.log("animal is unknown");
      break;
};
//animal이 lion이면 animal is lion 출력
//animal이 monkey이면 animal is monkey 출력
//animal에 아무것도 해당하지 않으면 animal is unknown 출력 

Javascript 기초문법(9)_함수

함수의 사용

function add(a,b){
	return a+b;
}
const sum = add(10, 20);
console.log(sum);	// 30을 출력, function을 사용하여 시작

arraw function

const add = (a,b) => {
	return a + b; 
}
console.log(add(10, 20));	// 30을 출력 

const add = (a,b) => a + b; 
console.log(add(10, 20));	//똑같이 30을 출력, 코드의 간결함