Break
- programming 에서 문장들은 code block { } 안에서 실행 된다
- 특별 한 경우 영역 안의 내용을 모두 실행 하지 않고 빠져 나오는 방법이 있다.
- 좋은 예로 switch 문의 case 가 있다.
Break 예제
<script>
// break는 진행중인 문장을 빠져나온다.
for(var i=0; i<10; i++){
console.log("i : "+i);
if(i == 3){
break; //
}
}
</script>
- 탐색할 경우
10000개의 데이터 중 찾는 내용이 500번째에 있었다면 더이상 찾지 않고 빠져 나온다.- sharing
100개의 빵을 나누어 주는데, 100개가 소진되면 더이상 나눠주지 않고 빠져 나온다.- 알고리즘 탐색할 때 많이 쓰임.
Continue
- programming 에서 문장들은 code block { } 안에서 실행 된다.
- 특별한 경우 무시하고 지나치는 방법도 있다.
함수(Function)
- 변수가 데이터를 담는 무언가 라면
- 함수는 동작을 실행해 주는 무언가 이다.
메서드 구조
- 메서드는 아래와 같은 구조로 이루어져 있다.
메서드 구성요소
- 하지만 메서드는 구성요소를 꼭 모두 가지고 있는 것은 아니다.
함수 예제
<script>
// 매개변수 : O, 반환값 : O
function 토스트기(빵){
return "구워진 "+빵;
}
// 매개변수 : X, 반환값 : O
function 번호표기계(){
return "번호표";
}
// 매개변수 : O, 반환값 : X
function 저금통(동전){
console.log(동전+" 저장");
}
// 매개변수 : X, 반환값 : X
function 호출벨(){
console.log("호출");
}
</script>배열(Array)
배열 기초
- 배열은 변수를 일렬로 세워놓고 각 상자에 번호를 붙여 놓은 형태이다.
- 인덱스의 순서는 0부터 시작한다.
- 배열은 기준 변수로부터 얼마나 떨어졌는지 가 이름이 된다고 하였다.
- 값을 넣거나 부를 때 이 이름을 사용 한다.
- length 속성은 해당 배열의 길이 값을 가지고 있다.
기초 예제
<script>
/*배열 선언*/
var arrNum = [];
var arrString = new Array();
/*배열에 데이터 추가*/
arrNum = [1,2,3,4]; // 한꺼번에 넣는 방식
console.log(arrNum);
arrNum[4] = 5; // 특정 방번호(인덱스)
console.log(arrNum);
arrNum.push(6); // 무조건 마지막에 넣는 방식
console.log(arrNum);
// 배열은 기본적으로 길이의 정보를 제공한다.
console.log(arrNum.length);
// 배열 역시도 어떤 것이든 다 들어 간다.
arrString.push(1); // 숫자
arrString.push("A"); // 문자
arrString.push(true); // boolean
arrString.push([10,20,30]); // 배열
arrString.push(function(){console.log("함수 실행")}); // 함수
console.log(arrString);
var dish;
dish = arrString[0];
console.log(dish);
dish = arrString[1];
console.log(dish);
dish = arrString[2];
console.log(dish);
dish = arrString[3];
console.log(dish);
arrString[4]();
// 많이 사용할 배열 구조
</script>📌요약(Summary)
- 배열은 여러 개의 변수를 하나에 담는 기능을 한다.
- 배열은 특정 기준 변수[0] 로 부터 얼마나 떨어 졌는가 가 이름이 된다.
- 배열의 크기는 거의 무한하다.
배열 - Function
- Java script 에서는 배열을 다룰 수 있는 여러 함수를 제공 해 준다.
- 대표적으로 push, pop, slice 등이 있다.
배열 - Function 예제
<body>
<button onclick="arrPush()">push</button>
<button onclick="arrPop()">pop</button>
<button onclick="arrUnshift()">unshift</button>
<button onclick="arrShift()">shift</button>
<hr/>
<button onclick="arrSlice()">범위자르기</button>
<button onclick="spliceDel()">spliceDel</button>
<button onclick="spliceAdd()">spliceAdd</button>
<hr/>
<button onclick="arrConcat()">배열병합</button>
<button onclick="arrDel()">delete</button>
<button onclick="arrJoin()">join</button>
</body>
<script>
var arr = [];
var i = 1;
function arrPush(){
// console.log("click!!!!");
arr.push(i); // 뒤에서 데이터를 넣는다.
console.log(arr);
i++;
}
function arrPop(){
var num = arr.pop(); // 뒤에서 데이터를 빼낸다.
console.log("빼낸 값 : "+num);
console.log(arr);
}
function arrUnshift(){
arr.unshift(i); // 앞에서 데이터를 넣는다.
i++;
console.log(arr);
}
function arrShift(){
var num = arr.shift(); // 앞에서 데이터를 빼낸다.
console.log("빼낸 값 : "+num);
console.log(arr);
}
function arrSlice(){
// slice : 원본 배열에서 특정 영역만큼 복사해서 가져온다.
// slice(필요한번호, 버릴번호)
// var numArr = [0,1,2,3,4,5];
// console.log(numArr);
// 1번부터 가져오고, 4번부터 필요없음
// 이걸 복사해서 newArr이라는 변수에 넣음
// var newArr = numArr.slice(1,4);
// console.log(newArr);
// DFG를 가져와 newArr에 넣어라
var strArr = ["A","S","D","F","G","H"]
var newArr = strArr.slice(2,5)
console.log(newArr);
}
arr = ['가','나','다','라','마','바','사'];
function spliceDel(){
// splice() 이용해서 데이터 추가하기
console.log(arr);
arr.splice(2,2);
console.log(arr);
}
function spliceAdd(){
// splice()를 이용해서 데이터 수정하기
console.log(arr);
// 다,라 -> A,B
// 몇번인덱스부터, 몇개 지우기, 추가할 값들...
// arr.splice(2,2,'A','B');
// 2번 인덱스부터 2개를 지우고 그 자리에 A와 B를 넣는다.
// 지우지 않고, 2번인덱스에 A,B만 추가해 보자.
arr.splice(2,0,'A','B');
console.log(arr);
}
function arrConcat(){
// 배열 합치기
var arr1 = [1,2,3,4,5];
var arr2 = ['A','B','C','D','E'];
// arr1.concat(arr2,arr3,...);
// arr1과 arr2를 합하여 newArr에 반환
var newArr = arr1.concat(arr2);
console.log(newArr);
}
function arrJoin(){
var arr = [1,2,3,4,5];
console.log(arr);
console.log(arr.join('*')); // 배열값과 값 사이에 들어갈 문자 삽입
}
function arrDel(){
// 특정한 방을 지워준다.
var arr = [1,2,3,4,5];
console.log(arr);
// ''과 null은 같은가?
delete arr[2]; // arr의 2번 인덱스를 지우고, 빈칸으로 놔둔다.
// 이 경우 2번 인덱스는 비어있기 때문에 문제가 될 수 있다.
// 그래서 지우고 난 이후에는 어떤 값이라도 넣어줘야 한다.
arr[2] = 0;
console.log(arr);
}
</script>배열 - Shallow Copy
배열 - Shallow Copy 예제
<script>
var x = 10;
var y = x;
x = 20;
// 이때 x와 y의 값은?
// x : 20, y : 10
console.log(x,y); // 당연한 결과
var a = [1,2,3,4,5];
var b = a;
console.log("a : "+a.valueOf());
console.log("b : "+b.valueOf());
a[0] = 50;
b[4] = 100;
console.log("a : "+a.valueOf());
console.log("b : "+b.valueOf());
// 우리는 a의 배열을 건드렸지만 b배열의 값도 변경되었다.
// 이것을 shallow copy라고 부른다.
// 두 배열은 복사되었기 보다는 링크되었다고 보는 것이 맞다.
// 그래서 실수가 많이 일어난다.(일반 변수에서는 안그러니까)
// 복사하려면 그냥 하나씩 옮겨야 한다.
// 일부만 복사 하려면 앞에서 배운 slice를 사용하면 된다.
var src = ["A","B","C","D","E"];
var dst = [];
// for문 만들기
// 1. 공통점 찾기 dst[] = src[];
// 2. 패턴 찾기 숫자가 0~4로 증가하네?
for(var i=0; i<5; i++){ // 3. 간단한 실행
console.log(i);
dst[i] = src[i]; // 4. 적용하기
}
src[0] = 100;
src[3] = "가";
console.log(src);
console.log(dst);
</script>배열 - 차원
- 차원은 1차원 배열 2차원 배열 3차원 배열 등 다차원 배열을 활용 할 수 있다.
- 다차원 배열의 개념을 아파트와 방의 개념으로 생각해보자.
📌요약(Summary)
- 배열을 편리하게 사용 할 수 있도록 여러 함수를 제공 해 준다.
- 배열 간의 복사는 하나씩 빼서 이동시켜야 한다.
- 2차원 배열 부터는 아파트의 개념으로 생각 하는 것이 쉽다.
