반복문
1.while
let j = 0
while(j<10) {
조건이 true면 실행
실행할 구문
j++;
}
do while 문
do{
조건이 true면 실행
}while(조건:표현식);
먼저 1회 수행 후 조건을 확인함.
2.for
for(초기값; 조건; 증감){
실행할 구문
}
ex > for(let i=; i<10; i++) {
console.log(i)
}
i= 0 , 1 , 2 , 3, 4 .... 9까지 진행. 10이되면 10과 같은값이되서 false가 되서 종료(개수가 정해져 있을때 사용하면 편함)
변수.forEach(value,index,Array) {
변수길이만큼 자동 반복
}
변수.forEach(function(list){
console.llog(list);
}) -> 값만 받아옴
for(let i = 0; i<변수.length; i++){
console.log(fruits[i]);
} for문으로 배열의 접근
for of문
for(let 변수명 of 배열명){
console.log(변수명)
} // 순차적으로 배열을 출력해줌. forEach와 동일
반복문 종료문
1. break : 완전히 빠져나오기
for(let i = 0; i<10; i++){
console.log(i);
if(i===6){
break;
}
} 1,2,3,4,5,6 / 종료
2. continue : 다음 반복으로 넘어감
for(let i = 0; i<10; i++){
if(i===6) continue; (1줄인 경우 생략가능)
console.log(i);
} // 1,2,3,4,5,7,8,9 출력
삼항연산자는 사용이 불가능함. ? 뒤에 break나 continue 사용이 불가
배열 Array
let arr = ['사과','딸기','바나나','오렌지'];
arr[0] -> 사과
arr[1] -> 딸기 ... 자동으로 index가 결정됨
배열이 아니라면
let str = '사과';
let str2 = 딸기';
배열의 위치는 index라고하며 0번부터 순서대로 되어있다.
배열의 선언방법 3가지
1. var arr = ['사과','딸기','오렌지'];
2. var arr = Array('사과','딸기','오렌지');
3. var arr = new Array('사과','딸기','오렌지');
빈배열 = true
빈 문자열 = false
length 길이
배열에 담긴 요소의 갯수 arr.length
배열의 마지막 요소의 위치 arr.length-1
배열요소 값을 변경
arr[0] = '귤';
배열에 배열요소를 추가
배열 요소를 삭제
delete arr[index] 값은 삭제되더라도 배열의 길이는 같음 '비어있다.'
arr[arr.length] = '귤' 마지막 값에 추가가능
배열.push('값') // 맨뒤에 값을 추가
배열.pop('값') // 맨뒤의 값을 삭제
배열.unshift('값') // 맨앞에 값을 추가
배열.shift('값') // 맨앞의 값을 삭제
Array.prototype으로부터 메소드와 프로퍼티를 상속받습니다.
1. 원본 배열을 변경하지 않고 참조만 하는 메소드
1) join() // 배열을 합쳐서 문자열로 반환
2) slice() // 시작인덱스부터 마지막인덱스-1까지 반환
3) concat() // 배열을 합쳐서 새로운 배열로 반환
4) indexOf() // 배열에 그 요소가 있는지 확인 후 인덱스 반환
5) includes() // 배열에 요소가 있는지 확인 후 있으면 true 없으면 false
6). spilt() // 문자열을 배열로 변환하기
7) find() // 해당조건에 맞는 하나의 값을 찾아서 반환
8) filter() // 해당조건에 맞는 모든 값을 찾아서 배열로 반환
9) map() // 값을 수정 후 배열로 반환
10) some) // 해당조건이 있는 값을 찾으면 true
2. 원본 배열을 변경하는 메소드
1) push() // 배열의 맨 끝에 요소를 추가
2) pop() // 배열의 맨 끝에 요소를 삭제
3) shift() // 배열의 맨 처음에 요소를 삭제
4) unshift() // 배열의 맨 처음에 요소를 추가
5) splice() // 배열의 인덱스값과 몇개를선택할지 숫자를 입력하면 삭제됌. 값을 입력하면 값추가 가능
6) reverse() // 배열 요소의 순서를 반대로 교체함
Number메소드
Number 객체에 정의되어 있는 숫자와 관련된 작업을 할때 사용되는 메소드
작업을 할때 사용되는 메소드
1.parseInt() 문자열을 정수 숫자형으로 변환
2.parseFloat() 문자열에 포함된 숫자 부분을 실수 형태로 형변환
3.isNaN() 전달된값이 NaN인지 아닌지를 검사
4.isInteger() 전달된 값이 정수인지 아닌지 검사
객체 - 다양한 데이터를 담을 수 있음
객체 리터럴 방식
let user = {}
let user = {
name: "green",
age: 30
} // 왼쪽은 키 오른쪽은 값. 배열이 인덱스로 접근하면 객체는 키로 접근함
user.name
user['name']
객체 생성자 방식
let user = net Object();
객체의 for문
forEach
for(let item of arr)
for(let item in obj){
obj[item]; // 그냥 item출력시 객체가 가진 key가 출력
}
객체는 프로퍼티로 되어있다.
(key: value) // 하나의 프로퍼티
let cat = {
name:'나비', //프로퍼티
age:3,
weight:4,
sleep:funtion(){ // 메서드
console.log('쿨쿨');
}
}
메서드의 사용 : cat.sleep();
객체복사
javascrpit 내장 객체
javascrpit 엔진이 구동되는 시점에 바로 제공되어 javascript코드 어디에서든 사용이 가능한 객체
- Global
- Object
- String
- Number
- boolean
- Date
- Array
- Math
Math.random() / 0보다 크고 1보다 작은 무작위 숫자를 반환
Math.round() / 인수로 전달받은 값을 소수점 첫번째자리에서 반올림해서 반환
Math.floor() / 인수로 전달받은 값을 소수점 아래자리에서 내림한 결과를 반환
Math.ceil() / 인수로 전달받은 값을 소수점 아래자리에서 올림한 결과를 반환
'프론트앤드 수업' 카테고리의 다른 글
[javascript] 객체의 선언 및 복사 (0) | 2022.05.03 |
---|---|
[javascript] 배열 메서드 예제 (0) | 2022.05.03 |
[Javascript] input으로 받아온 값 확인 후 배경색변경하기 (0) | 2022.04.28 |
[Javascript] 삼항조건식 if문 Swich+ 예제 (0) | 2022.04.28 |
자바스크립트 ID PW 확인 (0) | 2022.04.27 |