[Learn.JS] JavaScript-2 (Array 다루기, 연산자, 조건문)

Manipulating Arrays

Pushing and popping

---

Array들은 스택의 역할도 한다. push와 pop 메서드는 array의 끝에 데이터를 insert 하거나 제거해준다. 예를 들어, 빈 array를 만들고 몇 개의 변수들을 push 해주겠다.

var myStack = [];
myStack.push(1);
myStack.push(2);
myStack.push(3);
console.log(myStack);

이렇게 출력 될 것이다.

1,2,3

array에 변수들을 push 한 후에 끝에 있는 변수들을 pop 할 수 있다.

console.log(myStack.pop());
console.log(myStack);

그러면 배열에서 꺼낸 변수와 배열의 남은 부분이 출력됩니다.

3           // the result from myStack.pop()
1,2         // what myStack contains now

Queues using shifting and unshifting

unshift와 shift 기능은 push와 pop와 비슷하다. 이것들은 array의 시작에서 동작한다.

우리는 push와 shift 방법을 연속적으로 사용하여 어레이를 큐로 활용할 수 있습니다.

var myQueue = [];
myQueue.push(1);
myQueue.push(2);
myQueue.push(3);

console.log(myQueue.shift());
console.log(myQueue.shift());
console.log(myQueue.shift());

Shift 키워드는 배열의 변수를 삽입된 정확한 순서로 제거하며, 출력은 다음과 같습니다.

1
2
3

unshift 메서드는 배열의 시작 부분에 변수를 삽입하는 데 사용됩니다.

var myArray = [1,2,3];
myArray.unshift(0);
console.log(myArray);    // will print out 0,1,2,3

Splicing

자바스크립트의 스플라이싱 배열은 배열에서 특정 부분을 제거하여 우리가 꺼낸 부분으로 구성된 새로운 배열을 만든다. 예를 들어, 세 번째 인덱스부터 시작하여 다음 배열에서 다섯 개의 숫자를 제거하려면 다음을 수행합니다.

var myArray = [0,1,2,3,4,5,6,7,8,9];
var splice = myArray.splice(3,5);

console.log(splice);           // will print out 3,4,5,6,7
console.log(myArray);          // will print out 0,1,2,8,9

배열을 스플라이싱한 후에는 그 앞뒤의 원소들만 남아있습니다. 스플라이스(3,5)를 했으므로 3 인덱스부터 5개가 나오기 때문에 3과 7 사이의 모든 변수(포함)가 스플라이스 되었고, 0과 2 사이의 모든 변수(포함), 8과 9 사이의 모든 변수를 포함하는 배열이 남아있습니다.

Exercise

이 튜토리얼에서 myArray라는 Array 구조를 다룰 것이며 다음을 해주세요

1. Array 끝에 숫자 42를 push 하세요
2. Array 처음을 Shift 해주세요

var myArray = [true, "What is the meaning of life?"];

//1.
myArray.push(42);
//2.
myArray.shift();
console.log(myArray[0]);
console.log(myArray[1]);

//예상 답
//What is the meaning of life?
//42

---

Operators

자바스크립트의 모든 변수는 자동으로 캐스팅되므로 두 변수 사이의 연산자는 항상 어떤 종류의 결과를 제공한다.

The addition operator

---

+연산자는 두개의 문자열을 더 할 때 사용한다.

예를 들어, 두 개의 변수들을 합치는 건 쉽다:

var a = 1;
var b = 2;
var c = a + b;           // c is now equal to 3

추가 연산자는 문자열과 숫자, 숫자를 문자열에 연결하는 데 사용된다:

var name = "John";
console.log("Hello" + name + "!");
console.log("The meaning of life is " + 42);
console.log(42 + " is the meaning of life");

JavaScript는 유형이 다른 두 피연산자를 결합하려고 할 때 다르게 동작합니다. 기본 기본 값은 문자열이므로 문자열에 숫자를 추가하려고 할 때 JavaScript는 연결 전에 숫자를 문자열로 변환합니다.

console.log(1 + "1");       // outputs "11"

Mathematical operators

---

숫자를 빼거나, 곱하거나 나눌 때, -, *, / 를 사용합니다.

console.log( 3 - 5 );        // output -2
console.log( 3 * 5 );        // outputs 15
console.log( 3 / 5 );        // outputs 0.6

Advanced mathematical opeators

---

자바스크립트는 나머지 연산자 ( % ) 를 지원한다.

console.log ( 5 % 3 );            // outputs 2

JavaScript는 또한 할당 및 운영 연산자를 결합할 수 있도록 지원합니다. myNumber = myNumber / 2를 입력하는 대신 myNumber /= 2를 입력할 수 있습니다.

• /=
• *=
• -=
• +=
• %=

자바 스크립트는 또한 추가적인 기능을 가진 Math 모듈을 가지고 있습니다.

• Math.abs 는 절대값을 계산합니다.
• Math.exp는 숫자의 거듭제곱으로 e를 계산합니다.
• Math.pow(x, y)는 x의 결과를 y의 거듭제곱으로 계산합니다.
• Math.floor는 숫자에서 분수 부분을 제거합니다.
• Math.random()은 임의의 숫자 x를 제공합니다. 여기서 0 <=x <1

그리고 더 많은 수학적 기능들을 가지고 있습니다.

Exercise

다음을 따라 해 주세요

1. firstName과 lastName을 연결하여 fullName을 만들어주세요. 하지만 두 이름 사이에 (” “) 공백을 넣어주세요
2. myNumber에 2를 곱해주세요 그리고 그 결과를 meaningofLIfe에 넣어주세요

var firstName = "John";
var lastName = "Smith";
var myNumber = 21;

// TODO: change the following code
var fullName = firstName + " " + lastName;
var meaningOfLife = myNumber*=2;

console.log("The name is " + fullName);
console.log("The meaning of life is " + meaningOfLife);

---

Conditions

The if statement

---

if 구문은 표현이 true 인지 false 인지 확인해줍니다, 그리고 결과에 따라 다른 코드를 실행합니다.

예를 들어, 우리에게 그의 이름이 ‘John’인지 물어본다면 우리는 confirm 기능을 사용할 수 있습니다.

if (confirm("Are you John Smith?"))
{
	console.log("Hello John, how are you?");
} else {
	console.log("Then what is your name?")'
}

특정 식이 true인 경우에만 코드 블록을 실행하려는 경우엔 else 키워드를 생략할 수 있다.

두 변수가 같은지 여부를 평가하기 위해 == 연산자를 사용합니다. 또한 JavaScript에는 엄격한 비교를 수행하는, ===,라는 또 다른 동등 연산자가 있습니다. 이것은 당신이 비교하고 있는 두 가지가 같은 유형, 그리고 같은 내용일 경우에만 사실이라는 것을 의미합니다.

console.log("1" == 1); // true
console.log("1" === 1); // false 자료형도 같아야 true가 된다

예를 들어,

var myNumber = 42;
var (myNumber == 42)
{
	console.log("The number is correct.");
}

비교 연산자는 또한 표현식을 평가하는 데 사용될 수 있다.

var foo = 1;
var bar = 2;

if (foo < bar)
{
	console.log("foo is smaller that bar.");
}

논리 연산자를 사용하여 두 개 이상의 식을 함께 계산하여 두 식이 함께 true로 평가하는지 또는 둘 중 하나 이상을 함께 평가하는지 확인할 수 있습니다. 두 식이 모두 true로 평가되는지 확인하려면 AND 연산자 && 을 사용하십시오. 식 중 하나 이상이 true로 평가되는지 확인하려면 OR 연산자 || 를 사용합니다.

var foo = 1;
var bar = 2;
var moo = 3;

if ( foo < bar && moo > bar)
{
	console.log("foo is smaller than bar AND moo is larger that bar.");
}

if (foo < bar || moo > bar)
{
	console.log("foo is smaller that bar OR moo is larger than bar.");
}

NOT 연산자! 같은 방식으로 사용할 수 있다.

var notTrue = false;
if (!notTrue)
{
	console.log("not not true is true!");
}

The switch statement

---

switch 문은 C 프로그래밍 언어의 switch문과 유사하지만 문자열도 지원합니다.  

var rank = "Commander";
switch(rank)
{
    case "Private":
    case "Sergeant":
        console.log("You are not authorized.");
        break;
    case "Commander":
        console.log("Hello commander! what can I do for you today?");
        break;
    case "Captain":
        console.log("Hello captain! I will do anything you wish.");
        break;
	default:
        console.log("I don't know what your rank is.");
        break;
}

이 예시에서 "사병"과 "상사"는 모두 첫 번째 문장을 트리거하고, "사령관"은 두 번째 문장을 트리거하며, "대장"은 세 번째 문장을 트리거합니다. 알 수 없는 순위로 결정된 경우 default 키워드는 이 경우에 대한 액션을 정의합니다(선택 사항). switch 가 다음 코드 블록을 실행하는 것을 방지하기 위해 모든 코드 블록 사이의 break 문을 사용해야 합니다.

break 키워드 입력을 잊어버린 경우 매우 혼란스러운 결과가 초래되므로 일반적으로 switch 문을 사용하지 않는 것이 좋습니다.

Exercise

이 연습에서는 숫자 myNumber가 42인지 확인하는 checkNumber 함수 문 안에 if 문을 구성해야 합니다. 이러한 경우, 함수는 console.log를 사용하여 단어 correct를 인쇄해야 합니다. myNumber가 42와 같지 않으면 console.log를 사용하여 단어 incorrect를 출력해야 합니다. 괄호 안에 이름을 입력하여 함수에 전달된 인수의 이름을 지정할 수 있습니다. 예를 들어 myFunction(myArgument) 함수를 사용합니다.

function checkNumber(myNumber)
{
    // TODO: write your code here
		if (myNumber === 42){
			console.log(" correct ");
		} else {
			console.log( "incorrect");
		}
}

checkNumber(3);
checkNumber(7);
checkNumber(42);