조건문
if문
기본적인 if 문
let x = 10;
if (x > 0) {
console.log("x는 양수입니다.");
}
if-else
let x = -10;
if (x > 0) {
console.log("x는 양수입니다.");
} else {
console.log("x는 음수입니다.");
}
if-else else-if
조건을 순서대로 비교
let x = 0;
if (x > 0) {
console.log("x는 양수입니다.");
} else if (x < 0) {
console.log("x는 음수입니다.");
} else {
console.log("x는 0입니다.");
}
switch문
문자열 비교. default는 모두 안맞으면 실행되는 최종 코드
let fruit = "사과";
switch (fruit) {
case "사과":
console.log("사과는 빨간색입니다.");
break;
case "바나나":
console.log("바나나는 노란색입니다.");
break;
case "오렌지":
console.log("오렌지는 주황색입니다.");
break;
default:
console.log("해당하는 과일이 없습니다.");
break;
}
삼항연산자
if else 문과 비슷함.
let age = 20;
let message = (age >= 18) ? "성인입니다." : "미성년자입니다.";
console.log(message); // "성인입니다."
조건문의 중첩
중첩해서 복합적인 조건 판별 가능함.
let age = 20;
let gender = "여성";
if (age >= 18) {
if (gender === "남성") {
console.log("성인 남성입니다.");
} else {
console.log("성인 여성입니다.");
}
} else {
console.log("미성년자입니다.");
}
조건부 실행
윙?
if (x > 0) {
console.log("x는 양수입니다.");
}
이걸 간단하게 아래와 같이 바꿀 수 있음. 요즘 많이 씀
let x = 10;
(x > 0) && console.log("x는 양수입니다.");
삼항연산자와 단축평가
읭?
x가 undefined이면 y에다가 10을 세팅해줘!
let x;
let y = x || 10;
console.log(y); // 10
flasy 한 값과 truthy한 값
아래 있는 0, 빈 문자열, null, undefined, NaN, false 는 모두 false한 값임. / 나머지는 모두 truth함.
if (0) {
console.log("이 코드는 실행되지 않습니다.");
}
if ("") {
console.log("이 코드는 실행되지 않습니다.");
}
if (null) {
console.log("이 코드는 실행되지 않습니다.");
}
if (undefined) {
console.log("이 코드는 실행되지 않습니다.");
}
if (NaN) {
console.log("이 코드는 실행되지 않습니다.");
}
if (false) {
console.log("이 코드는 실행되지 않습니다.");
}
객체(object)와 배열(array)
객체와 객체 메소드
객체를 사용하여 여러개의 값을 하나의 변수에 담고 관리 가능.
기본적인 객체 생성
중괄호 사용. 속성과 값을 콜론: 으로 구분하여 작성, 속성은 쉼표, 로 구분.
let person = {
name: "홍길동",
age: 30,
gender: "남자"
};
생성자 함수 사용한 객체 생성
생성자 함수 Person()이용하여 person1, person2 생성
function Person(name, age, gender) {
this.name = name;
this.age = age;
this.gender = gender;
}
let person1 = new Person("홍길동", 30, "남자");
let person2 = new Person("홍길순", 25, "여자");
객체 속성 접근
점 . 사용하여 속성 이름(key) 입력하여 값(value) 출력
[]대괄호로 접근도 가능함.
let person = {
name: "홍길동",
age: 30,
gender: "남자"
};
console.log(person.name); // "홍길동"
console.log(person.age); // 30
console.log(person.gender); // "남자"
console.log(person[gender]); // "남자"
객체 메소드
Object.keys(객체명)메소드 //오브젝트의 속성 이름(key)을 배열로 return
let person = {
name: "홍길동",
age: 30,
gender: "남자"
};
let keys = Object.keys(person);
console.log(keys); // ["name", "age", "gender"]
Object.values(객체명) 메소드 // 객체의 속성값(value)를 배열로 return
let person = {
name: "홍길동",
age: 30,
gender: "남자"
};
let values = Object.values(person);
console.log(values); // ["홍길동", 30, "남자"]
Object.entries(객체명) 메소드 // key와 value를 2차원 배열로 return
let person = {
name: "홍길동",
age: 30,
gender: "남자"
};
let entries = Object.entries(person);
console.log(entries);
//[ [ 'name', '홍길동' ], [ 'age', 30 ], [ 'gender', '남자' ] ]
Object.assign(복사받는객체, 복사해오는객체) 메소드 // 객체 복사, 일부 값 변경하며 복사
const copy = Object.assign({}, object); 이런식으로 써서 1단계 깊은 복사 가능.
let person = {
name: "홍길동",
age: 30,
gender: "남자"
};
let person2 = {};
Object.assign(person2, person); // 뒤에껄 앞쪽으로 복사할래.
console.log(person2); // { name: "홍길동", age: 30, gender: "남자" }
let person3 = {};
Object.assign(person3, person, {age:31}); // 근데 age는 31로 바꾸면서 복사할래.
console.log(person3) //{ name: "홍길동", age: 31, gender: "남자" }
//이렇게 간단하게 합칠수도 있음. 그러면 person4대신에 {}이 들어감.
let Person4 = Object.assign({}, person, { age: 35 });
console.log(Person4);
// { name: "홍길동", age: 35, gender: "남자" }
객체 비교
객체의 값이 같더라도, 서로 다른 메모리에 할당이 되고, 그 메모리 주소값을 저장하므로,
===연산자로는 비교하면 주소값이 달라서 false임.
JSON.stringify 메소드를 사용하면 문자열화해서 비교 가능함.
let person1 = {
name: "홍길동",
age: 30,
gender: "남자"
};
let person2 = {
name: "홍길동",
age: 30,
gender: "남자"
};
console.log(person1 === person2); // false
console.log(JSON.stringify(person1) === JSON.stringify(person2)); // true
객제병합
... : spread operator => 중괄호 없애줌.
let person1 = {
name: "홍길동",
age: 30
};
let person2 = {
gender: "남자"
};
let Person3 = {...person1, ...person2};
console.log(Person3); // { name: "홍길동", age: 30, gender: "남자" }
쓰레드?
배열
배열 생성
기본적인 배열 생성
대괄호[]와 콤마, 로 구분해서 사용함!
let fruits = ["사과", "바나나", "오렌지"];
배열의 크기 지정
let 배열명 = new Array(크기)
let numbers = new Array(5);
colsole.log(numbers.length); // 5
배열의 요소 접근
배열명[인덱스]
인덱스를 변수로 자주 사용함.(for문 의 i)
let fruits = ["사과", "바나나", "오렌지"];
console.log(fruits[0]); // "사과"
console.log(fruits[1]); // "바나나"
console.log(fruits[2]); // "오렌지"
배열 매소드
.indexOf(요소) 메소드 // 요소의 인덱스 출력
const answer = emergency.map( function (x) {
return sorted.indexOf(x)+1})
return answer;
}
.push(요소) 메소드 // 배열 끝에 추가
let fruits = ["사과", "바나나"];
fruits.push("오렌지");
console.log(fruits); // ["사과", "바나나", "오렌지"]
.pop(요소) 메소드 // 마지막 요소 삭제
let fruits = ["사과", "바나나", "오렌지"];
fruits.pop();
console.log(fruits); // ["사과", "바나나"]
.shift(요소) 메소드 // 첫번째 요소 삭제
javascriptCopy code
let fruits = ["사과", "바나나", "오렌지"];
fruits.shift();
console.log(fruits); // ["바나나", "오렌지"]
.unshift(요소) 메소드 // 첫번째에 요소 추가
let fruits = ["바나나", "오렌지"];
fruits.unshift("사과");
console.log(fruits); // ["사과", "바나나", "오렌지"]
.splice(요소) 메소드 // ~부터 시작해서 ~개 를 삭제하고 ~를 넣어줘 [원본변경]
(시작위치번호, 삭제갯수, 넣는값)
let fruits = ["사과", "바나나", "오렌지"];
fruits.splice(1, 1, "포도");
console.log(fruits); // ["사과", "포도", "오렌지"]
.slice(요소) 메소드 // ~부터 ~까지 새로운 배열로 반환
slice() 빈 괄호로 실행하면 배열을 복사해줌!! (1단계 배열의 깊은 복사. )
(여기서부터, 여기까지) 새로운 배열로 반환해줌.
let fruits = ["사과", "바나나", "오렌지"];
let slicedFruits = fruits.slice(1, 2);
console.log(slicedFruits); // ["바나나"]
.forEach(function(item){함수}); 메소드 // 요소 하나씩 사용해서 콜백함수 실행함.
배열의 각각 요소를 가져와서 콜백함수 (매개변수에 들어가는 function(number)) 하나씩 쭉쭉 실행한 뒤,
let numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
console.log(number);
});
.map(function(item){return 함수 }) 메소드 // 요소로 콜백함수를 실행한 뒤, 결과값으로 새로운 배열 생성.
반드시 return 을 가져야 함 ( 새로운 배열이 튀어나옴! )
항상 원본 배열의 길이만큼 return이 됨!
let numbers = [1, 2, 3, 4, 5];
let squaredNumbers = numbers.map(function(number) {
return number * number;
});
console.log(squaredNumbers); // [1, 4, 9, 16, 25]
.filter(function(item){return 조건문}); 메소드 // 조건문 통과한 요소의 배열 반환
조건문(콜백함수)을 무사히 통과한 (true) 요소만 가져와서 새로운 배열 return
let numbers = [1, 2, 3, 4, 5];
let evenNumbers = numbers.filter(function(number) {
return number % 2 === 0;
});
console.log(evenNumbers); // [2, 4]
.find(function(item){return 조건문}); 메소드 // 조건문 통과한 첫번째 요소 반환
조건문(콜백함수)를 통과한 첫번째 요소를 return
let numbers = [1, 2, 3, 4, 5];
let foundNumber = numbers.find(function(number) {
return number > 3;
});
console.log(foundNumber); // 4
.reduce(function(accumulator, currentvalue){return 조건문}, 초깃값 ); 메소드 //누적계산
초깃값에 각 요소를 순차적으로 돌면서 누적해서 계산을 해서 하나의 값을 반환함.
첫번째 요소에 두번째 요소를 계산하고, 거기에 세번째 요소를 계산하고..
여기서 초깃값을 0으로 설정은 해주지 않으면, current index:1부터 계산하며, 빈 배열시 오류 발생함.
let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce(function(accumulator, currentValue) {
return accumulator + currentValue;
}, 0);
console.log(sum);
.some(function(item){return 조건문}); 메소드 // 조건에 맞는게 하나라도 있으면 true
let numbers = [1, 2, 3, 4, 5];
let hasEvenNumber = numbers.some(function(number) {
return number % 2 === 0;
});
console.log(hasEvenNumber); // true
.every(function(item){return 조건문}); 메소드 // 조건메 모든 요소가 싹다 true이면 true
let numbers = [2, 4, 6, 8, 10];
let isAllEvenNumbers = numbers.every(function(number) {
return number % 2 === 0;
});
console.log(isAllEvenNumbers); // true
.sort(function(a, b){return 배열조건문}); 메소드 // 정해진 순서대로 배열을 정렬 [원본변경]
배열조건문의 값이 음수이면 a를 b 앞에 정렬
배열 조건문의 값이 양수이면 a를 b 뒤에 정렬
배열 조건문이 0 이면 그냥 놔둠
let numbers = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5];
numbers.sort(function(a, b) {
return a - b;
});
console.log(numbers); // [1, 1, 2, 3, 3, 4, 5, 5, 5, 6, 9]
복잡해지면 map을 이용해서 임시배열 생성뒤 하라고 하는데, mdn
.reverse(); 메소드 // 배열 역순 정렬 [원본변경]
배열의 순서를 뒤집음.
let numbers = [1, 2, 3, 4, 5];
numbers.reverse();
console.log(numbers); // [5, 4, 3, 2, 1]
.join(); 메소드 // 괄호안에 구분자 ⭐️
붙여서 출력시 join(''); 이 형식으로 사용함.
function solution(my_string, n) {
let array = my_string.split('');
let result = [];
for(letter of array){
for(let i = 0; i < n; i++){
result.push(letter);
}
}
return result.join('');
}// "hhheeellllllooo"
반복문
for문 // 반복문
for(초기값; 조건식; 증감식){실행문}; // 기본 for문
초기값이 조건이 될때까지 증감하며 반복한다.
for (let i = 0; i < 10; i++) {
console.log(i);
}
quiz
for (i = 0; i <= 10; i++) {
if (i % 2 == 0) {
console.log(i);
}
}
배열과 함께 사용하는 for 문
// 배열 요소의 갯수만큼 반복하여 실행함.
let numbers = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
배열의 index로 접근해서 사용.
for...in문 // 배열의 index값을 하나씩 사용해서 실행
value 값이 아닌 0,1,2,3 의 index 값임에 유의할 것!
let person = { name: "John", age: 30, gender: "male" };
for (let key in person) {
console.log(key + ": " + person[key]);
}
for...of문 // 배열의 value 값을 하나씩 사용해서 실행
function solution(num_list) {
let odd = 0;
let even = 0;
for (num of num_list) {
console.log(num);
num % 2 === 0 ? even++ : odd++;
}
return [even, odd]
}
while문
조건문이 만족하는 동안만 반복실행.
let i = 0;
while (i < 10) {
console.log(i);
i++; //이거 없으면 무한루프
}
do...while 문
실행 후 조건문에 만족하는지 체크. 최초 무조건 한번은 실행됨.
let i = 0;
do {
console.log(i);
i++; //이거 없으면 무한루프
} while (i < 10);
break 문과 continue문
break 문
이 조건 만나면 바로 반복문 종료~
for (let i = 0; i < 10; i++) {
if (i === 5) {
break;
}
console.log(i);
}
//0
//1
//2
//3
//4
continue 문
이 조건 만나면 이번 턴은 PASS~ 그리고 그 다음 턴부터 continue
for (let i = 0; i < 10; i++) {
if (i === 5) {
continue;
}
console.log(i);
}
//0~9 중에 5만 빼고 출력됨
연습문제2개
Quiz.1
https://school.programmers.co.kr/learn/courses/30/lessons/12916
function solution(s){
var answer = true;
let letterP = 0;
let letterY = 0;
let sentense = Array.from(s.toUpperCase());
sentense.forEach(function(letter){
if(letter == 'P') {
letterP++;
} else if (letter == 'Y'){
letterY++;
}
})
if(letterP !== letterY){
answer = false;
}
return answer;
}
좀더 간략화 가능
function solution(s){
var answer = true;
let letterP = 0;
let letterY = 0;
let sentense = s.toUpperCase();
for(let i = 0; i < sentense.length; i++){
if(sentense[i] == 'P') {
letterP++;
} else if (sentense[i] == 'Y'){
letterY++;
}
};
answer = (letterP === letterY);
return answer;
}
Quiz.2
https://school.programmers.co.kr/learn/courses/30/lessons/76501
function solution(absolutes, signs) {
let answer = 0;
for(let i = 0; i < signs.length; i++) {
if(signs[i] === true){
answer += absolutes[i];
}else{
answer -= absolutes[i];
}
}
return answer;
}
삼항연산자를 꼭 숙달시킬것.
function solution(absolutes, signs) {
let answer = 0;
for(let i = 0; i < signs.length; i++) {
signs[i] ? answer += absolutes[i] : answer -= absolutes[i]
}
return answer;
}
/