스터디 1, 2일차에 리뷰할 Hackerrank 10 Days of Javascript 풀이 


https://www.hackerrank.com/domains/tutorials/10-days-of-javascript?filters%5Bstatus%5D%5B%5D=unsolved&badge_type=10-days-of-javascript



Day 0: Hello, World!


1
2
3
4
5
6
7
8
9
10
11
12
13
14
/**
*   A line of code that prints "Hello, World!" on a new line is provided in the editor. 
*   Write a second line of code that prints the contents of 'parameterVariable' on a new line.
*
*    Parameter:
*   parameterVariable - A string of text.
**/
function greeting(parameterVariable) {
    // This line prints 'Hello, World!' to the console:
    console.log('Hello, World!');
 
    // Write a line of code that prints parameterVariable to stdout using console.log:
    console.log(parameterVariable);
}
cs



Day 0: Data Types


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
/**
*   The variables 'firstInteger', 'firstDecimal', and 'firstString' are declared for you -- do not modify them.
*   Print three lines:
*   1. The sum of 'firstInteger' and the Number representation of 'secondInteger'.
*   2. The sum of 'firstDecimal' and the Number representation of 'secondDecimal'.
*   3. The concatenation of 'firstString' and 'secondString' ('firstString' must be first).
*
*    Parameter(s):
*   secondInteger - The string representation of an integer.
*   secondDecimal - The string representation of a floating-point number.
*   secondString - A string consisting of one or more space-separated words.
**/
function performOperation(secondInteger, secondDecimal, secondString) {
    // Declare a variable named 'firstInteger' and initialize with integer value 4.
    const firstInteger = 4;
    
    // Declare a variable named 'firstDecimal' and initialize with floating-point value 4.0.
    const firstDecimal = 4.0;
    
    // Declare a variable named 'firstString' and initialize with the string "HackerRank".
    const firstString = 'HackerRank ';
    
    // Write code that uses console.log to print the sum of the 'firstInteger' and 'secondInteger' (converted to a Number        type) on a new line.
    console.log(Number(firstInteger) + Number(secondInteger));
    
    // Write code that uses console.log to print the sum of 'firstDecimal' and 'secondDecimal' (converted to a Number            type) on a new line.
    console.log(Number(firstDecimal) + Number(secondDecimal));
    
    // Write code that uses console.log to print the concatenation of 'firstString' and 'secondString' on a new line. The        variable 'firstString' must be printed first.
    console.log(firstString + secondString);
}
cs



Day 1: Arithmetic Operators


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
/**
*   Calculate the area of a rectangle.
*
*   length: The length of the rectangle.
*   width: The width of the rectangle.
*   
*    Return a number denoting the rectangle's area.
**/
function getArea(length, width) {
    let area;
    // Write your code here
    area = length * width;
    return area;
}
 
/**
*   Calculate the perimeter of a rectangle.
*    
*    length: The length of the rectangle.
*   width: The width of the rectangle.
*   
*    Return a number denoting the perimeter of a rectangle.
**/
function getPerimeter(length, width) {
    let perimeter;
    // Write your code here
    perimeter = 2 * (length + width);
    return perimeter;
}
cs



Day 1: Functions


1
2
3
4
5
/*
 * Create the function factorial here
 */
 
const factorial = n => (n === 0 ? 1 : n * factorial(n - 1));
cs


- Arrow Functions에 대한 추가 공부 필요



Day 1: Let and Const


1
2
3
4
5
6
7
8
9
function main() {
    // Write your code here. Read input using 'readLine()' and print output using 'console.log()'.
    const PI = Math.PI;
    let r = readLine();
    // Print the area of the circle:
    console.log(PI * Math.pow(r, 2));
    // Print the perimeter of the circle:
    console.log(2 * PI * r);
}
cs


참고링크 - https://gist.github.com/LeoHeo/7c2a2a6dbcf80becaaa1e61e90091e5d


- let과 const의 차이점은 변수의 immutable여부.

- let은 변수에 재할당이 가능하지만, const는 변수 재선언, 재할당 모두 불가능. 

- const는 선언과 동시에 값을 할당 해야함.



Day 2: Conditional Statements: If-Else


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function getGrade(score) {
    let grade;
    // Write your code here
    if (score <= 30 && score > 25)
        grade = "A";
    else if (score <= 25 && score > 20)
        grade = "B";
    else if (score <= 20 && score > 15)
        grade = "C";
    else if (score <= 15 && score > 10)
        grade = "D";
    else if (score <= 10 && score > 5)
        grade = "E";
    else if (score <= 5 && score >= 0)
        grade = "F";
 
    return grade;
}
cs


- Discussions에 있는 배열을 이용한 풀이 이해 안 됨.



Day 2: Conditional Statements: Switch


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function getLetter(s) {
    let letter;
    // Write your code here
    var array1 = ['a''e''i''o''u'];
    var array2 = ['b''c''d''f''g'];
    var array3 = ['h''j''k''l''m'];
 
    switch (true) { 
        case array1.includes(s[0]):
            letter = 'A';
            break;
        case array2.includes(s[0]):
            letter = 'B';
            break;
        case array3.includes(s[0]):
            letter = 'C';
            break;
        default:
            letter = 'D';
    
    }
 
    return letter;
}
cs


Default Clause는 관습적으로 Switch문의 가장 마지막에 오며, break는 사용할 수 없다.

- includes(); : 배열에 특정 요소가 포함되어 있는지 여부를 확인하는 메서드





'정글 스터디' 카테고리의 다른 글

Day 01~02. 해커랭크 풀이  (0) 2018.11.26

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
/* 7, 14, 21, 28 번째 box 배경색 변경 (7의배수) */
.box:nth-child(7n){
    font-size:14px;
}
/* 22번 부터 이후 모든 box 폰트색 변경 */
.box:nth-child(n+22) {
    font-size:14px;
}
/* 1번째 부터 4번째 까지 box 배경색 변경 */
.box:nth-child(-n+5) {
   font-size:14px;
}
.box:nth-of-type(-n+6){
    font-size:14px;
}
/* 16번째 부터 19번째 까지 box 배경색 변경 */
.box:nth-child(n+16):nth-child(-n+19) {
    font-size:14px;
}
/* 맨 뒤에서 부터 3번째 */
.box:nth-last-child(3) {
    font-size:14px;
}
/*
    nth-last-child(n)는  마지막에서부터 순서를 계산
    .box:nth-child(odd){color: red;} 홀수
    .box:nth-child(even){color: red;} 짝수
    
    -child는 n의 값이 1부터 들어가고, -of type은 n의 값이 0부터 시작 됨.
*/
cs


'Tech > CSS' 카테고리의 다른 글

nth-child, nth-of-type selector  (0) 2018.10.18
부모의 높이가 0일 때, 높이를 잡는 방법  (0) 2018.09.05
Reset CSS  (0) 2018.07.09
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Number guessing game</title>
    <style>
      html {
        font-family: sans-serif;
      }
      body {
        width: 50%;
        max-width: 800px;
        min-width: 480px;
        margin: 0 auto;
      }
      .lastResult {
        color: white;
        padding: 3px;
      }
    </style>
  </head>
  <body>
    <h1>Number guessing game</h1>
    <p>We have selected a random number between 1 and 100. See if you can guess it in 10 turns or fewer. We'll tell you if your guess was too high or too low.</p>
    <div class="form">
      <label for="guessField">Enter a guess: </label><input type="text" id="guessField" class="guessField">
      <input type="submit" value="Submit guess" class="guessSubmit">
    </div>
    <div class="resultParas">
      <p class="guesses"></p>
      <p class="lastResult"></p>
      <p class="lowOrHi"></p>
    </div>
    <script>
        'use stricts';
        var randomNumber = Math.floor(Math.random() * 100+ 1;
        
        var guesses = document.querySelector('.guesses');
        var lastResult = document.querySelector('.lastResult');
        var lowOrHi = document.querySelector('.lowOrHi');
        
        var guessSubmit = document.querySelector('.guessSubmit');
        var guessField = documentField = document.querySelector('.guessField');
        
        var guessCount = 1;
        var resetButton;
        
        guessField.focus();
        
        function checkGuess() {
            var userGuess = Number(guessField.value);
            if (guessCount === 1) {
                guesses.textContent = 'Previous guesses: ';
            }
            guesses.textContent += userGuess + ' ';
            
            if (userGuess === randomNumber) {
                lastResult.textContent = 'Congratulations! You got it right!';
                lastResult.style.backgroundColor = 'green';
                lowOrHi.textContent = '';
                setGameOver();
            } else if (guessCount === 10) {
                lastResult.textContent = '!!! GAME OVER !!!';
                setGameOver();
            } else {
                lastResult.textContent = 'Wrong!';
                lastResult.style.backgroundColor = 'red';
                if (userGuess < randomNumber) {
                    lowOrHi.textContent = 'Last guess was too low!';
                } else if (userGuess > randomNumber) {
                    lowOrHi.textContent = 'Last guess was too high!';
                }
            }
            
            guessCount++;
            guessField.value = '';
            guessField.focus();
        } // end of checkGuess
        
        guessSubmit.addEventListener('click', checkGuess); // click이 일어나면 checkGuess 함수를 실행. addEventListener() 안에서는 함수의 괄호가 필요 없음.
        
        function setGameOver() {
            guessField.disabled = true;
            guessSubmit.disabled = true;
            resetButton = document.createElement('button');
            resetButton.textContent = 'Start new game';
            document.body.appendChild(resetButton);
            resetButton.addEventListener('click', resetGame);
        } // end of setGameOver
        
        function resetGame() {
            guessCount = 1;
            
            var resetParas = document.querySelectorAll('.resultParas p'); // div.resultParas 안의 모든 문장을 배열 형태로 저장
            for (var i = 0; i < resetParas.length; i++) {
                resetParas[i].textContent = '';
            }
            
            resetButton.parentNode.removeChild(resetButton);
            
            guessField.disabled = false;
            guessSubmit.disabled = false;
            guessField.value = '';
            guessField.focus();
            
            lastResult.style.backgroundColor = 'white';
            
            randomNumber = Math.floor(Math.random() * 100+ 1;
        } // end of resetGame
    </script>
  </body>
</html>
cs




See the Pen Number guessing game by likeanewstar (@likeanewstar) on CodePen.



참고 URL : https://developer.mozilla.org/ko/docs/Learn/JavaScript/First_steps/A_first_splash

'Tech > JavaScript' 카테고리의 다른 글

Number guessing game 만들기  (0) 2018.10.04
How do I get the current date in JavaScript?  (0) 2018.07.27

+ Recent posts

티스토리 툴바