본문 바로가기

강의 실습159

배열 내장함수-2 1. concat concat 메서드를 사용하면 두 개의 배열을 하나로 합쳐 새로운 배열로 반환할 수 있다. // concat let array1 = ["green", "blue"]; let array2 = ["purple", "yellow"]; console.log(array1.concat(array2)); 2. join join 메서드는 하나의 배열에서 배열 요소들의 값들을 문자열로 이어주는 메서드이다. // join let colors = ["green", "blue", "purple"]; console.log(colors.join()); console.log(colors.join(" ")); join 메서드 내부에 들어가는 매개변수는 구분자로, 요소들을 합칠 때 사이에 어떤 문자를 넣을 것인지 결.. 2023. 8. 23.
배열 내장함수-1 배열은 굉장히 많은 내장 함수(메서드)를 가지고 있다. 이 내장함수들을 잘 다룰 수 있게 되면 유연하고 깔끔한 프로그래밍을 할 수 있다. 자바스크립트 배열의 내장 함수들 중, 자주 사용되는 내장 함수들을 몇 가지 살펴본다. 1. forEach 배열의 모든 요소들에 접근하기 위해 for문을 사용했었다. // for문 let arr = [1, 2, 3, 4, 5]; for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } 배열의 요소들에 접근하기 위해서는 for문을 사용할 수도 있지만, 자바스크립트에서는 배열의 내장함수를 이용해 더 간단하게 배열 요소에 접근할 수 있다. // forEach 메서드 let arr = [1, 2, 3, 4, 5]; arr.f.. 2023. 8. 21.
반복문 반복문은 특정 작업을 반복적으로 수행 할 때 사용되는 구문으로, 프로그래밍을 할 때 아주 유용하게 자주 쓰이는 중요한 개념이다. 1. for문 가장 기본적인 반복문으로, 조건에 따라 일정 횟수 만큼 같은 코드를 반복 실행해야 할 때 사용한다. 1부터 5까지 출력하는 프로그램을 작성한다. 반복문을 사용하지 않는다면, 이렇게 console.log를 5번 반복 작성해 출력해야 한다. // 반복문 사용하지 않음 console.log(1); console.log(2); console.log(3); console.log(4); console.log(5); for문을 이용해 같은 프로그램을 작성한다. for문은 초기화식, 조건식, 증감식 그리고 실행해야할 코드로 이렇게 구성되어 있다. // for문 // 1~5 fo.. 2023. 8. 10.
배열 배열은 순서가 있는 요소들의 집합으로 여러개의 항목들이 모여 있는 리스트 이다. 1. 배열 생성 배열은 객체와 비슷하게 2가지 방법으로 생성할 수 있다. 1) 배열 생성자 생성자를 사용할 때에는 new 라는 키워드를 사용해야 한다. // 배열 생성자 let arr = new Array(); console.log(arr); // [] 코드를 실행하면, 객체는 { } 가 출력되었지만, 배열은 [ ] 가 출력 된다. 생성자를 이용해 선언된 배열에 값을 넣어본다. let array1 = new Array(1, 2, 3); let array2 = new Array(3); console.log(array1); // [1, 2, 3] console.log(array2); // [undefined, undefined,.. 2023. 8. 9.
객체 1. 객체 생성 객체는 비원시 타입 자료형으로, 한 번에 여러 개의 데이터 값들을 저장할 수 있는 자료형이다. 객체를 생성하는 방법에는 2가지 방법이 있는데, 객체 생성자를 사용해 만드는 방법과 중괄호를 이용한 객체 리터럴 방식이다. 1) 객체 생성자 new 라는 키워드를 통해 객체를 생성할 수 있다. // 객체 생성자 let person = new Object(); 2) 객체 리터럴 중괄호를 이용해 객체를 생성하며, 가장 많이 사용되는 방식이다. // 객체 리터럴 let person = {}; 2. 객체 프로퍼티 객체의 프로퍼티는 객체의 중괄호 내부에 들어갈 데이터로, key와 value쌍으로 이루어져있는 데이터이다. 객체의 프로퍼티는 :(콜론)을 기준으로 왼쪽에는 key값을, 오른쪽에는 value를 .. 2023. 8. 8.
함수 표현식 1. 함수 표현식 함수를 선언할 때 function 키워드 옆에 함수의 이름을 적는 방식을 함수 선언식 이라고 한다. // 함수 선언식 function print() { console.log("hello world"); } 자바스크립트에서는 함수를 선언할 때 이러한 함수 선언식 외에 함수 표현식을 이용해 함수를 만들 수 있다. // 함수 표현식 let print = function () { console.log("hello world"); }; 코드를 보면 print 라는 변수에 "hello world"를 출력하는 함수를 마치 값처럼 할당했는데, print 는 변수이지만 함수를 값으로 가지고 있어 함수를 호출하는 것과 동일하게 "print();" 로 호출할 수 있다. 2. 함수 선언식 vs 함수 표현식 .. 2023. 8. 7.
호이스팅 호이스팅이란, 아직 선언되지 않은 함수나 변수들을 해당 스코프의 맨 위로 끌어올려서 사용하는 것처럼 보이게하는 자바스크립트의 작동 방식. 1. 함수 호이스팅 // 호이스팅 // 함수 호이스팅 print(); function print() { console.log("hello world"); } 작성된 코드를 실행시켜보면, print 함수를 호출하면 함수가 아직 선언되지 않았지만 함수가 오류 없이 정상적으로 작동. 해당 코드가 정상적으로 작동하는 이유는, 자바스크립트 엔진이 코드를 해석하는 과정에서 이렇게 print 호출문 보다 선언문이 먼저 작성되어있는 코드로 받아들였기 때문. // 자바스크립트 엔진이 코드 해석시 function print() { console.log("hello world"); } p.. 2023. 8. 6.
스코프 스코프(Scope)는 직역하면 범위 라는 뜻으로 자바스크립트에서 변수 또는 함수를 생성할 때, 해당 변수 또는 함수가 갖게 되는 유효범위를 뜻함. 1. 전역 스코프와 지역 스코프 전역 스코프는 Global Scope로 전역에 선언되어있어 어디서든지 해당 변수에 접근 할 수 있는 범위를 뜻함. 지역 스코프는 Local Scope로 해당 지역에서만 접근할 수 있고 지역을 벗어난 곳에서는 접근할 수 없는 범위를 뜻함. // 스코프 // 전역 스코프와 지역 스코프 const num = 10; //전역 스코프 function print() { const num = 100; //지역 스코프 console.log(`지역 스코프 ${num}`); } print(); console.log(`전역 스코프 ${num}`);.. 2023. 8. 4.
함수와 지역변수, 외부변수 함수는 같은 동작을 하는, 중복된 코드가 여기저기에 존재할 때, 이들을 하나로 묶어 하나의 명령으로 실행할 수 있게 해주는 기능. 1. 함수 작성법 두 개의 숫자를 더하는 코드는 두 변수에 각각의 숫자를 할당하고, 더하기 연산을 통해 두 숫자를 더한 값을 새로운 변수에 저장 후 출력해야 한다. 만약, 여기서 또 다른 숫자들을 더하는 연산을 추가로 실행해야한다면, 같은 기능을 하는 코드를 반복해서 작성해야되기 때문에 코드 길이도 상당히 길어지고, 작성하기 번거롭다는 단점이 있다. // 함수 let num1 = 10; let num2 = 15; let sum = num1 + num2; console.log(sum); //25 let num3 = 1; let num4 = 5; let sum2 = num3 + .. 2023. 8. 3.