기본타입

코드 블록의 Try it Yourself 버튼으로 직접 실행할 수 있다.

구문

Info: 💡 타입스크립트는 자바스크립트에 타입을 추가하여 확장한 것.

자바스크립트(동적타입:Dynamic Type)
- 모든것이 런타임 시 결정됨
- 코드의 실행해 봐야 오류를 알게됨
타입스크립트(정적타입:Static Type)
- 컴파일 단계에서 결정됨
- 컴파일 시 오류유무가 판단

🔗공식핸드북

1. Primitives : 원시타입

Info: Primitives: 기본자료형 7종 (원시타입)

종류	설명
boolean	참(true) 또는 거짓(false) 값	let isDone: boolean = true;
number	정수와 실수를 포함한 숫자 값	let count: number = 42;
string	문자	let name: string = "야”;
null	값이 없음	let empty: null = null;
undefined	값이 정의되지 않음	let notSet: undefined;
symbol	고유하고 불변인 값, 주로 키로 사용
let sym: symbol = Symbol("id");
bigint	큰 정수	let big: bigint = 123n;

bigint JavaScript와 타입스크립트에서 도입된 원시 타입으로, 기존 number 타입이 표현할 수 있는 범위를 넘어서는 정수를 다룰 때 사용. number 타입은 IEEE 754 표준에 따라 64비트 부동소수점으로 표현되며, 안전하게 다룰 수 있는 최대 정수 값은 2^53 - 1(약 9,007,199,254,740,991: 구조 칠백십구억 이천오백사십칠만 사천구백구십일) 이다.

1.1. basic.ts

선언시 자료의 형태를 지정한다.
아래의 명령어를 터미널에 입력하면 실시간 컴파일이 된다.
npx tsc -w

1.1.1. string

문자타입지정
선언과 동시에 할당도 가능하다

let myName: string = 'mango';
console.log(myName);

자료형은 반드시 소문자로 작성한다 number(O) Number(X) 대문자로 작성시 오류가 발생하지는 않지만 Number 함수가 반환된다!!!!
Template Literal 의 사용

myName = `👌${myName}`;
console.log(myName);

1.1.2. number

숫자타입지정

{
  // number
  let n: number;
  n = 12;
  n = 12.1;
  n = -12.1;
  n = NaN;
  n = Infinity;
  console.log(n);
}

지정된 자료형 이외의 값을 할당하면 에러를 표시한다

  n = 'n';

1.1.3.boolean

논리타입을 지정해보자

  let cham: boolean = true;
  cham = false;
  console.log(typeof cham);

비교연산자를 사용할수도 있다

cham = 10 > 5;
console.log(cham);

JSON.parse로 형변환을 해보자

let realTrue: boolean ='true';

위의 코드는 불타입에 스트링타입이 할당되었으므로 오류가 반환된다.
JSON.parse 메서드를 사용하면 자료형 변환이 된다.

let realTrue: boolean = JSON.parse('true');

Boolean 함수로 형변환을 해보자

	realTrue = Boolean('true');
	console.log(typeof realTrue);

3과4의 차이는 뭘까? 콘솔의 결과는 둘다 불타입이다. 아래와 같이 비교해보자

  console.log(JSON.parse('true'));
  console.log(Boolean('false'));

Boolean() 은 0보다 큰 자료를 모두 true 로 변환하므로 false 문자열도 true 로 바뀌기에 예상치 못한 오류가 생길수 있다.

1.1.4. null, undefined

null과 undefined 도 별도의 타입으로 지정해야 한다.
null 타입지정

let x: null = null;
console.log(c);

undefined 타입지정

let b: undefined = undefined;
console.log(b);

?? nullish 널병합연산자를 사용해보자 🔗https://ko.javascript.info/nullish-coalescing-operator

let c = x ?? 'test';
console.log(c);

?? 좌항이 null이면 우항을 실행-> x는 null 이므로 test 가 실행

2. Non-Primitive(비원시타입)

Info: Non-Primitives: 기본자료형 8종 (비원시타입/특수타입)

종류	설명
object	키-값 쌍으로 구성된 데이터 구조	let user: object = { name: "야" };
array	동일한 타입의 요소를 순서대로 저장	let list: number[] = [1, 2, 3];
tuple	고정된 길이와 타입을 갖는 배열	let pair: [string, number] = ["야", 1];
enum	특정 값들의 집합을 이름으로 정의	enum Color { Red, Green, Blue };
function	실행 가능한 코드 블록	let add: (a: number, b: number) => number;
any	모든 타입을 허용하는 동적 타입	let anything: any = "야"
void	함수 반환 값이 없을 때 사용	function log(): void { console.log("야"); }
never	절대 발생하지 않는 값	function fail(): never { throw new Error(); }

2.1. object

🔗https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EA%B0%9D%EC%B2%B4-%ED%83%80%EC%9E%85

객체타입지정

 //object
  let obj: object = {name: 'mango', age: 7};

기타 등등 타입

  const obj1: object = {};
  const obj2: object = [];
  const obj3: object = function(){};

자바스크립트의 원시타입만 빼고 모두 다 object 타입으로 지정이 가능하다.

특이점은 값을 꺼내어 쓸때 발생하게 된다.

console.log(obj.name;);

위의 코드는 오류를 반환한다. obj 식별자의 타입은 지정이 되었으나 name 프로퍼티의 타입은 지정되지 않았기 때문이다.

아래와 같이 obj의 타입선언을 수정한다.

let obj: {name:string; age:number} = {name: 'mango', age: 7};
console.log(obj.name;);

이제 콘솔창에서 name 속성의 값을 볼수있다. 타입스크립트에서 타입 지정 대상은 모든 변수라는 점을 기억하자. 또한 객체의 타입 지정시 문법이 헷갈릴수 있으니 주의해야한다.

2.2. array

https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EB%B0%B0%EC%97%B4

배열타입을 지정해보자

  //array
  const arr:[]=[]
  const arrT: Array<[]> = [];

배열의 타입지정은 대괄호를 사용하거나 제네릭 표기법을 사용한다.

배열 내에서 사용할 데이터도 각각의 타입을 지정해야 한다. 1의 예시의 식별자들은 빈 배열만 사용할수 있다.

    {
      const arr: number[] = [1, 2, 3, 4];
      const arrT: Array<number> = [1, 2, 34];
      console.log(`${arr},//////////,${arrT}`);
    }
   {
      const arr: string[] = ["a","b"];
      const arrT: Array<string> = ["a","b"];
      console.log(`${arr},//////////,${arrT}`);
    }

혼합된 데이터는 인덱스 번호에 맞게 타입을 지정한다.

 const arr: [string, string, number, number, object, number[]] = ['a', 'b', 1, 2, {}, [1, 2]];

이차원배열

//동일데이터
const nestArr:number[][] = [
  [1, 2, 3],
  [11, 21, 31],
  [111, 211, 311],
];
//// 제네릭
const nestArrT: Array<Array<number>> = [
  [1, 2, 3],
  [11, 21, 31],
  [111, 211, 311],
];

//다중데이터 => 튜플
const mixArr: [number, string, number[], {}] = [1, 'a', [1, 2, 3], {}];

2.2.1. Tupel(튜플)

타입스크립트에서 튜플(tuple)은 배열 자료형의 특별한 형태로 배열내의 자료형이 복합적일때 각각 선언하는 것을 말한다.

특징

고정된 길이를 가짐
각 위치마다 특정 타입이 지정됨

예시

const user: [string, number] = ['mango', 8];

2.2.2.Optional Property(옵셔널프로퍼티)

🔗https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EC%98%B5%EC%85%94%EB%84%90-%ED%94%84%EB%A1%9C%ED%8D%BC%ED%8B%B0

동적으로 관리되는 배열 자료형은 어떻게 타입을 선언해야 할까?1

아래의 코드는 타입선언과 데이터의 길이가 맞지 않아 오류가 난다.

 const optional: [number, string] = [1, 'a', 1];

아래 추가된 ?가 붙은 타입은 옵셔널프로퍼티 라고 한다.

const optional: [number, string, number?] = [1, 'a', 1];

옵셔널속성은 잠재적으로 사용할 타입을 선언하는 개념으로 타입을 선택적으로 지정할수 있게한다.

Spread Operator 를 사용한 타입선언

  let b: string[] = ['a', 'b', 'c'];
  let merge: [number, ...string[]] = [a, ...b];
  console.log(merge);

2.3. any 와 unknown

2.3.1. any

모든 타입허용 NextJs에서 오류남

  {
    //any
    let val: any = 10;
    val = 'a';
    val = () => {};
    val = [1, 2];
  }

2.3.2. unknown

타입이 정해지지 않았음. 일단 통과

  let a: unknown = 3;

2.3.3. 비교

any 타입은 모든 타입이 허용되므로 숫자 전달시에도 에러가 런타임에서 확인됨


  function anyVal(value: any) {
    console.log(value.toUpperCase());
  }

  anyVal('abcd');
//  anyVal(1234);

unknown 타입은 값의 사용시 오류가 난다.

  function unVal(value: unknown) {
    console.log(value.toUpperCase());
  }

  unVal('abcd');

아래와 같이 타입을 검사하는 코드를 작성해야 한다.

  function unVal(value: unknown) {
    //console.log(value.toUpperCase());
    if (typeof value === 'string') {
      console.log(value.toUpperCase());
    } else {
      console.error('string 타입만 가능');
    }
  }

항목	`any`	`unknown`
타입 체크	전혀 없음	타입 검사 필요
타입 안정성	낮음	높음
코드 안전성	런타임 오류 발생 가능	컴파일 단계에서 오류 방지 가능
타입 좁히기 필요 여부	❌ 없음	✅ 반드시 필요

3. 문제

출처: 수코딩

3.1.

1. 문제: 문자열 변수 선언

string 타입을 사용하여 "Hello"라는 값을 갖는 문자열 변수를 선언하고, 이 값을 출력하세요.

2. 문제: 숫자 변수 선언

number 타입을 사용하여 42라는 숫자를 갖는 변수를 선언하고, 출력하세요.

3. 문제: 불리언 변수 선언

boolean 타입을 사용하여 true 값을 갖는 변수를 선언하고, 출력하세요.

4. 문제: 숫자 배열 선언

Array<number> 또는 number[] 타입을 사용하여 숫자 배열을 선언하고, 배열의 요소들을 출력하세요.

5. 문제: 문자열 배열 선언

Array<string> 또는 string[] 타입을 사용하여 문자열 배열을 선언하고, 배열의 요소들을 출력하세요.

6. 문제: 튜플 변수 선언

tuple 타입을 사용하여 숫자와 문자열이 섞인 튜플을 선언하고, 이 값을 출력하세요.

7. 문제: `null` 값 할당

null 타입을 사용하여 null 값을 갖는 변수를 선언하고, 이를 출력하세요.

8. 문제: `undefined` 값 할당

undefined 타입을 사용하여 undefined 값을 갖는 변수를 선언하고, 이를 출력하세요.

9. 문제: 객체 선언

object 타입을 사용하여 이름과 나이를 포함하는 객체를 선언하고, 이를 출력하세요.

3.2.

1. 문제: 중첩된 객체

let employee = {
  id: 123,
  name: "John Doe",
  contact: {
    email: "john.doe@example.com",
    phone: "123-456-7890"
  },
  department: "Engineering"
};

이 변수의 타입을 지정하세요.

2. 문제: 객체 배열에서 특정 값 찾기

let students = [
  { name: "Alice", age: 22, grade: "A" },
  { name: "Bob", age: 24, grade: "B" },
  { name: "Charlie", age: 21, grade: "C" }
];

이 변수의 타입을 지정하세요.

3. 문제: 숫자 배열에서 최댓값 구하기

let numbers = [10, 20, 30, 40, 50];

이 변수의 타입을 지정하세요.

4. 문제: 객체 배열에서 특정 조건 만족하는 객체 찾기

let users = [
  { name: "Alice", age: 30, active: true },
  { name: "Bob", age: 25, active: false },
  { name: "Charlie", age: 35, active: true }
];

이 변수의 타입을 지정하세요.

5. 문제: 중첩된 배열

let nestedArray = [["apple", "banana"], [1, 2, 3], ["cherry"]];

이 변수의 타입을 지정하세요.

6. 문제: 문자열 배열에서 길이가 5 이상인 문자열 찾기

let words = ["apple", "banana", "cherry", "kiwi"];

이 변수의 타입을 지정하세요.

7. 문제: 여러 객체가 섞인 배열

let items = [
  { id: 1, name: "Item1", price: 100 },
  { id: 2, name: "Item2", price: 200 },
  ["discount", 10]
];

이 변수의 타입을 지정하세요.

8. 문제: 복합적인 객체

let profile = {
  user: { name: "John", age: 30 },
  preferences: ["coding", "reading", "travelling"],
  isActive: true
};

이 변수의 타입을 지정하세요.

9. 문제: 여러 타입을 가진 배열

let mixedData = ["apple", 10, true, "banana", 20];

이 변수의 타입을 지정하세요.

10. 문제: 중첩된 객체에서 키 접근하기

let company = {
  name: "Tech Corp",
  address: {
    street: "123 Main St",
    city: "Tech City",
    country: "Techland"
  }
};

이 변수의 타입을 지정하세요.

3.3

1. 문제: 중첩된 객체와 다양한 배열을 포함한 데이터

let complexData = {
  id: 1,
  name: "Product A",
  details: {
    description: "This is a great product",
    dimensions: {
      height: 10,
      width: 5,
      depth: 2
    },
    tags: ["sale", "new", "featured"]
  },
  reviews: [
    { user: "Alice", rating: 4.5, comment: "Excellent!" },
    { user: "Bob", rating: 3.0, comment: "Decent product." }
  ]
};

이 변수의 타입을 지정하세요.

2. 문제: 다차원 배열과 객체 혼합 구조

let dataset = [
  [{ id: 1, value: "a" }, { id: 2, value: "b" }],
  [{ id: 3, value: "c" }, { id: 4, value: "d" }],
  [{ id: 5, value: "e" }, { id: 6, value: "f" }]
];

이 변수의 타입을 지정하세요.

3. 문제: 중첩된 객체 배열에 조건이 다른 값 포함하기

let mixedData = [
  { type: "user", name: "Alice", age: 30 },
  { type: "user", name: "Bob", age: 25 },
  { type: "product", id: 1, name: "Laptop", price: 999 },
  { type: "product", id: 2, name: "Smartphone", price: 499 }
];

이 변수의 타입을 지정하세요.

4. 문제: 배열 안에 객체와 튜플이 섞인 구조

let dataSet = [
  { name: "Item A", price: 100 },
  [ "item1", 50 ],
  { name: "Item B", price: 200 },
  [ "item2", 75 ]
];

이 변수의 타입을 지정하세요.

5. 문제: 고급 배열과 객체의 중첩된 관계

let complexStructure = [
  { id: 1, value: "apple", attributes: { weight: 1.2, color: "green" }},
  { id: 2, value: "banana", attributes: { weight: 0.5, color: "yellow" }},
  { id: 3, value: "cherry", attributes: { weight: 0.2, color: "red" }}
];

이 변수의 타입을 지정하세요.

6. 문제: 배열 안에 객체와 중첩된 배열이 섞인 구조

let nestedData = [
  { id: 1, tags: ["fruit", "sweet"], name: "apple" },
  { id: 2, tags: ["fruit", "tropical"], name: "mango" },
  { id: 3, tags: ["fruit", "berry"], name: "strawberry" }
];

이 변수의 타입을 지정하세요.

7. 문제: 다양한 타입을 가진 배열로 구성된 객체

let profile = {
  name: "Alice",
  age: 28,
  favorites: [ "reading", 42, true, 99.9 ],
  address: {
    street: "123 Main St",
    city: "Metropolis"
  }
};

이 변수의 타입을 지정하세요.

8. 문제: 중첩된 객체 배열에서 특정 조건을 만족하는 값 찾기

let userData = [
  { user: { name: "John", age: 32 }, status: "active" },
  { user: { name: "Doe", age: 28 }, status: "inactive" },
  { user: { name: "Jane", age: 35 }, status: "active" }
];

이 변수의 타입을 지정하세요.

9. 문제: 배열 안에 객체와 다른 배열이 포함된 구조

let collection = [
  { id: 1, name: "Item 1", price: 100 },
  ["Discount", 20],
  { id: 2, name: "Item 2", price: 200 },
  ["Discount", 10]
];

이 변수의 타입을 지정하세요.

10. 문제: 객체 배열의 각 항목이 서로 다른 구조를 가진 배열

let mixedItems = [
  { id: 1, type: "food", name: "Pizza", size: "Large" },
  { id: 2, type: "drink", name: "Coke", size: "Medium" },
  { id: 3, type: "food", name: "Burger", size: "Small" }
];

이 변수의 타입을 지정하세요.

기본타입

코드 블록의 Try it Yourself 버튼으로 직접 실행할 수 있다.

구문

Info: 💡 타입스크립트는 자바스크립트에 타입을 추가하여 확장한 것.

자바스크립트(동적타입:Dynamic Type)
- 모든것이 런타임 시 결정됨
- 코드의 실행해 봐야 오류를 알게됨
타입스크립트(정적타입:Static Type)
- 컴파일 단계에서 결정됨
- 컴파일 시 오류유무가 판단

🔗공식핸드북

1. Primitives : 원시타입

Info: Primitives: 기본자료형 7종 (원시타입)

종류	설명
boolean	참(true) 또는 거짓(false) 값	let isDone: boolean = true;
number	정수와 실수를 포함한 숫자 값	let count: number = 42;
string	문자	let name: string = "야”;
null	값이 없음	let empty: null = null;
undefined	값이 정의되지 않음	let notSet: undefined;
symbol	고유하고 불변인 값, 주로 키로 사용
let sym: symbol = Symbol("id");
bigint	큰 정수	let big: bigint = 123n;

1.1. basic.ts

선언시 자료의 형태를 지정한다.
아래의 명령어를 터미널에 입력하면 실시간 컴파일이 된다.
npx tsc -w

1.1.1. string

문자타입지정
선언과 동시에 할당도 가능하다

let myName: string = 'mango';
console.log(myName);

자료형은 반드시 소문자로 작성한다 number(O) Number(X) 대문자로 작성시 오류가 발생하지는 않지만 Number 함수가 반환된다!!!!
Template Literal 의 사용

myName = `👌${myName}`;
console.log(myName);

1.1.2. number

숫자타입지정

{
  // number
  let n: number;
  n = 12;
  n = 12.1;
  n = -12.1;
  n = NaN;
  n = Infinity;
  console.log(n);
}

지정된 자료형 이외의 값을 할당하면 에러를 표시한다

  n = 'n';

1.1.3.boolean

논리타입을 지정해보자

  let cham: boolean = true;
  cham = false;
  console.log(typeof cham);

비교연산자를 사용할수도 있다

cham = 10 > 5;
console.log(cham);

JSON.parse로 형변환을 해보자

let realTrue: boolean ='true';

위의 코드는 불타입에 스트링타입이 할당되었으므로 오류가 반환된다.
JSON.parse 메서드를 사용하면 자료형 변환이 된다.

let realTrue: boolean = JSON.parse('true');

Boolean 함수로 형변환을 해보자

	realTrue = Boolean('true');
	console.log(typeof realTrue);

3과4의 차이는 뭘까? 콘솔의 결과는 둘다 불타입이다. 아래와 같이 비교해보자

  console.log(JSON.parse('true'));
  console.log(Boolean('false'));

Boolean() 은 0보다 큰 자료를 모두 true 로 변환하므로 false 문자열도 true 로 바뀌기에 예상치 못한 오류가 생길수 있다.

1.1.4. null, undefined

null과 undefined 도 별도의 타입으로 지정해야 한다.
null 타입지정

let x: null = null;
console.log(c);

undefined 타입지정

let b: undefined = undefined;
console.log(b);

?? nullish 널병합연산자를 사용해보자 🔗https://ko.javascript.info/nullish-coalescing-operator

let c = x ?? 'test';
console.log(c);

?? 좌항이 null이면 우항을 실행-> x는 null 이므로 test 가 실행

2. Non-Primitive(비원시타입)

Info: Non-Primitives: 기본자료형 8종 (비원시타입/특수타입)

종류	설명
object	키-값 쌍으로 구성된 데이터 구조	let user: object = { name: "야" };
array	동일한 타입의 요소를 순서대로 저장	let list: number[] = [1, 2, 3];
tuple	고정된 길이와 타입을 갖는 배열	let pair: [string, number] = ["야", 1];
enum	특정 값들의 집합을 이름으로 정의	enum Color { Red, Green, Blue };
function	실행 가능한 코드 블록	let add: (a: number, b: number) => number;
any	모든 타입을 허용하는 동적 타입	let anything: any = "야"
void	함수 반환 값이 없을 때 사용	function log(): void { console.log("야"); }
never	절대 발생하지 않는 값	function fail(): never { throw new Error(); }

2.1. object

🔗https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EA%B0%9D%EC%B2%B4-%ED%83%80%EC%9E%85

객체타입지정

 //object
  let obj: object = {name: 'mango', age: 7};

기타 등등 타입

  const obj1: object = {};
  const obj2: object = [];
  const obj3: object = function(){};

자바스크립트의 원시타입만 빼고 모두 다 object 타입으로 지정이 가능하다.

특이점은 값을 꺼내어 쓸때 발생하게 된다.

console.log(obj.name;);

위의 코드는 오류를 반환한다. obj 식별자의 타입은 지정이 되었으나 name 프로퍼티의 타입은 지정되지 않았기 때문이다.

아래와 같이 obj의 타입선언을 수정한다.

let obj: {name:string; age:number} = {name: 'mango', age: 7};
console.log(obj.name;);

2.2. array

https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EB%B0%B0%EC%97%B4

배열타입을 지정해보자

  //array
  const arr:[]=[]
  const arrT: Array<[]> = [];

배열의 타입지정은 대괄호를 사용하거나 제네릭 표기법을 사용한다.

배열 내에서 사용할 데이터도 각각의 타입을 지정해야 한다. 1의 예시의 식별자들은 빈 배열만 사용할수 있다.

    {
      const arr: number[] = [1, 2, 3, 4];
      const arrT: Array<number> = [1, 2, 34];
      console.log(`${arr},//////////,${arrT}`);
    }
   {
      const arr: string[] = ["a","b"];
      const arrT: Array<string> = ["a","b"];
      console.log(`${arr},//////////,${arrT}`);
    }

혼합된 데이터는 인덱스 번호에 맞게 타입을 지정한다.

 const arr: [string, string, number, number, object, number[]] = ['a', 'b', 1, 2, {}, [1, 2]];

이차원배열

//동일데이터
const nestArr:number[][] = [
  [1, 2, 3],
  [11, 21, 31],
  [111, 211, 311],
];
//// 제네릭
const nestArrT: Array<Array<number>> = [
  [1, 2, 3],
  [11, 21, 31],
  [111, 211, 311],
];

//다중데이터 => 튜플
const mixArr: [number, string, number[], {}] = [1, 'a', [1, 2, 3], {}];

2.2.1. Tupel(튜플)

타입스크립트에서 튜플(tuple)은 배열 자료형의 특별한 형태로 배열내의 자료형이 복합적일때 각각 선언하는 것을 말한다.

특징

고정된 길이를 가짐
각 위치마다 특정 타입이 지정됨

예시

const user: [string, number] = ['mango', 8];

2.2.2.Optional Property(옵셔널프로퍼티)

🔗https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EC%98%B5%EC%85%94%EB%84%90-%ED%94%84%EB%A1%9C%ED%8D%BC%ED%8B%B0

동적으로 관리되는 배열 자료형은 어떻게 타입을 선언해야 할까?1

아래의 코드는 타입선언과 데이터의 길이가 맞지 않아 오류가 난다.

 const optional: [number, string] = [1, 'a', 1];

아래 추가된 ?가 붙은 타입은 옵셔널프로퍼티 라고 한다.

const optional: [number, string, number?] = [1, 'a', 1];

옵셔널속성은 잠재적으로 사용할 타입을 선언하는 개념으로 타입을 선택적으로 지정할수 있게한다.

Spread Operator 를 사용한 타입선언

  let b: string[] = ['a', 'b', 'c'];
  let merge: [number, ...string[]] = [a, ...b];
  console.log(merge);

2.3. any 와 unknown

2.3.1. any

모든 타입허용 NextJs에서 오류남

  {
    //any
    let val: any = 10;
    val = 'a';
    val = () => {};
    val = [1, 2];
  }

2.3.2. unknown

타입이 정해지지 않았음. 일단 통과

  let a: unknown = 3;

2.3.3. 비교

any 타입은 모든 타입이 허용되므로 숫자 전달시에도 에러가 런타임에서 확인됨


  function anyVal(value: any) {
    console.log(value.toUpperCase());
  }

  anyVal('abcd');
//  anyVal(1234);

unknown 타입은 값의 사용시 오류가 난다.

  function unVal(value: unknown) {
    console.log(value.toUpperCase());
  }

  unVal('abcd');

아래와 같이 타입을 검사하는 코드를 작성해야 한다.

  function unVal(value: unknown) {
    //console.log(value.toUpperCase());
    if (typeof value === 'string') {
      console.log(value.toUpperCase());
    } else {
      console.error('string 타입만 가능');
    }
  }

항목	`any`	`unknown`
타입 체크	전혀 없음	타입 검사 필요
타입 안정성	낮음	높음
코드 안전성	런타임 오류 발생 가능	컴파일 단계에서 오류 방지 가능
타입 좁히기 필요 여부	❌ 없음	✅ 반드시 필요

3. 문제

출처: 수코딩

3.1.

1. 문제: 문자열 변수 선언

string 타입을 사용하여 "Hello"라는 값을 갖는 문자열 변수를 선언하고, 이 값을 출력하세요.

2. 문제: 숫자 변수 선언

number 타입을 사용하여 42라는 숫자를 갖는 변수를 선언하고, 출력하세요.

3. 문제: 불리언 변수 선언

boolean 타입을 사용하여 true 값을 갖는 변수를 선언하고, 출력하세요.

4. 문제: 숫자 배열 선언

Array<number> 또는 number[] 타입을 사용하여 숫자 배열을 선언하고, 배열의 요소들을 출력하세요.

5. 문제: 문자열 배열 선언

Array<string> 또는 string[] 타입을 사용하여 문자열 배열을 선언하고, 배열의 요소들을 출력하세요.

6. 문제: 튜플 변수 선언

tuple 타입을 사용하여 숫자와 문자열이 섞인 튜플을 선언하고, 이 값을 출력하세요.

7. 문제: `null` 값 할당

null 타입을 사용하여 null 값을 갖는 변수를 선언하고, 이를 출력하세요.

8. 문제: `undefined` 값 할당

undefined 타입을 사용하여 undefined 값을 갖는 변수를 선언하고, 이를 출력하세요.

9. 문제: 객체 선언

object 타입을 사용하여 이름과 나이를 포함하는 객체를 선언하고, 이를 출력하세요.

3.2.

1. 문제: 중첩된 객체

let employee = {
  id: 123,
  name: "John Doe",
  contact: {
    email: "john.doe@example.com",
    phone: "123-456-7890"
  },
  department: "Engineering"
};

이 변수의 타입을 지정하세요.

2. 문제: 객체 배열에서 특정 값 찾기

let students = [
  { name: "Alice", age: 22, grade: "A" },
  { name: "Bob", age: 24, grade: "B" },
  { name: "Charlie", age: 21, grade: "C" }
];

이 변수의 타입을 지정하세요.

3. 문제: 숫자 배열에서 최댓값 구하기

let numbers = [10, 20, 30, 40, 50];

이 변수의 타입을 지정하세요.

4. 문제: 객체 배열에서 특정 조건 만족하는 객체 찾기

let users = [
  { name: "Alice", age: 30, active: true },
  { name: "Bob", age: 25, active: false },
  { name: "Charlie", age: 35, active: true }
];

이 변수의 타입을 지정하세요.

5. 문제: 중첩된 배열

let nestedArray = [["apple", "banana"], [1, 2, 3], ["cherry"]];

이 변수의 타입을 지정하세요.

6. 문제: 문자열 배열에서 길이가 5 이상인 문자열 찾기

let words = ["apple", "banana", "cherry", "kiwi"];

이 변수의 타입을 지정하세요.

7. 문제: 여러 객체가 섞인 배열

let items = [
  { id: 1, name: "Item1", price: 100 },
  { id: 2, name: "Item2", price: 200 },
  ["discount", 10]
];

이 변수의 타입을 지정하세요.

8. 문제: 복합적인 객체

let profile = {
  user: { name: "John", age: 30 },
  preferences: ["coding", "reading", "travelling"],
  isActive: true
};

이 변수의 타입을 지정하세요.

9. 문제: 여러 타입을 가진 배열

let mixedData = ["apple", 10, true, "banana", 20];

이 변수의 타입을 지정하세요.

10. 문제: 중첩된 객체에서 키 접근하기

let company = {
  name: "Tech Corp",
  address: {
    street: "123 Main St",
    city: "Tech City",
    country: "Techland"
  }
};

이 변수의 타입을 지정하세요.

3.3

1. 문제: 중첩된 객체와 다양한 배열을 포함한 데이터

let complexData = {
  id: 1,
  name: "Product A",
  details: {
    description: "This is a great product",
    dimensions: {
      height: 10,
      width: 5,
      depth: 2
    },
    tags: ["sale", "new", "featured"]
  },
  reviews: [
    { user: "Alice", rating: 4.5, comment: "Excellent!" },
    { user: "Bob", rating: 3.0, comment: "Decent product." }
  ]
};

이 변수의 타입을 지정하세요.

2. 문제: 다차원 배열과 객체 혼합 구조

let dataset = [
  [{ id: 1, value: "a" }, { id: 2, value: "b" }],
  [{ id: 3, value: "c" }, { id: 4, value: "d" }],
  [{ id: 5, value: "e" }, { id: 6, value: "f" }]
];

이 변수의 타입을 지정하세요.

3. 문제: 중첩된 객체 배열에 조건이 다른 값 포함하기

let mixedData = [
  { type: "user", name: "Alice", age: 30 },
  { type: "user", name: "Bob", age: 25 },
  { type: "product", id: 1, name: "Laptop", price: 999 },
  { type: "product", id: 2, name: "Smartphone", price: 499 }
];

이 변수의 타입을 지정하세요.

4. 문제: 배열 안에 객체와 튜플이 섞인 구조

let dataSet = [
  { name: "Item A", price: 100 },
  [ "item1", 50 ],
  { name: "Item B", price: 200 },
  [ "item2", 75 ]
];

이 변수의 타입을 지정하세요.

5. 문제: 고급 배열과 객체의 중첩된 관계

let complexStructure = [
  { id: 1, value: "apple", attributes: { weight: 1.2, color: "green" }},
  { id: 2, value: "banana", attributes: { weight: 0.5, color: "yellow" }},
  { id: 3, value: "cherry", attributes: { weight: 0.2, color: "red" }}
];

이 변수의 타입을 지정하세요.

6. 문제: 배열 안에 객체와 중첩된 배열이 섞인 구조

let nestedData = [
  { id: 1, tags: ["fruit", "sweet"], name: "apple" },
  { id: 2, tags: ["fruit", "tropical"], name: "mango" },
  { id: 3, tags: ["fruit", "berry"], name: "strawberry" }
];

이 변수의 타입을 지정하세요.

7. 문제: 다양한 타입을 가진 배열로 구성된 객체

let profile = {
  name: "Alice",
  age: 28,
  favorites: [ "reading", 42, true, 99.9 ],
  address: {
    street: "123 Main St",
    city: "Metropolis"
  }
};

이 변수의 타입을 지정하세요.

8. 문제: 중첩된 객체 배열에서 특정 조건을 만족하는 값 찾기

let userData = [
  { user: { name: "John", age: 32 }, status: "active" },
  { user: { name: "Doe", age: 28 }, status: "inactive" },
  { user: { name: "Jane", age: 35 }, status: "active" }
];

이 변수의 타입을 지정하세요.

9. 문제: 배열 안에 객체와 다른 배열이 포함된 구조

let collection = [
  { id: 1, name: "Item 1", price: 100 },
  ["Discount", 20],
  { id: 2, name: "Item 2", price: 200 },
  ["Discount", 10]
];

이 변수의 타입을 지정하세요.

10. 문제: 객체 배열의 각 항목이 서로 다른 구조를 가진 배열

let mixedItems = [
  { id: 1, type: "food", name: "Pizza", size: "Large" },
  { id: 2, type: "drink", name: "Coke", size: "Medium" },
  { id: 3, type: "food", name: "Burger", size: "Small" }
];

이 변수의 타입을 지정하세요.

기본타입

구문

** **🔗공식핸드북

1. Primitives : 원시타입

1.1. basic.ts

1.1.1. string

1.1.2. number

1.1.3.boolean

1.1.4. null, undefined

2. Non-Primitive(비원시타입)

2.1. object

2.2. array

2.2.1. Tupel(튜플)

2.2.2.Optional Property(옵셔널프로퍼티)

2.3. any 와 unknown

2.3.1. any

2.3.2. unknown

2.3.3. 비교

3. 문제

3.1.

1. 문제: 문자열 변수 선언

2. 문제: 숫자 변수 선언

3. 문제: 불리언 변수 선언

4. 문제: 숫자 배열 선언

5. 문제: 문자열 배열 선언

6. 문제: 튜플 변수 선언

7. 문제: null 값 할당

8. 문제: undefined 값 할당

9. 문제: 객체 선언

3.2.

1. 문제: 중첩된 객체

2. 문제: 객체 배열에서 특정 값 찾기

3. 문제: 숫자 배열에서 최댓값 구하기

4. 문제: 객체 배열에서 특정 조건 만족하는 객체 찾기

5. 문제: 중첩된 배열

6. 문제: 문자열 배열에서 길이가 5 이상인 문자열 찾기

7. 문제: 여러 객체가 섞인 배열

8. 문제: 복합적인 객체

9. 문제: 여러 타입을 가진 배열

10. 문제: 중첩된 객체에서 키 접근하기

3.3

1. 문제: 중첩된 객체와 다양한 배열을 포함한 데이터

2. 문제: 다차원 배열과 객체 혼합 구조

3. 문제: 중첩된 객체 배열에 조건이 다른 값 포함하기

4. 문제: 배열 안에 객체와 튜플이 섞인 구조

5. 문제: 고급 배열과 객체의 중첩된 관계

6. 문제: 배열 안에 객체와 중첩된 배열이 섞인 구조

7. 문제: 다양한 타입을 가진 배열로 구성된 객체

8. 문제: 중첩된 객체 배열에서 특정 조건을 만족하는 값 찾기

9. 문제: 배열 안에 객체와 다른 배열이 포함된 구조

10. 문제: 객체 배열의 각 항목이 서로 다른 구조를 가진 배열

기본타입

구문

** **🔗공식핸드북

1. Primitives : 원시타입

1.1. basic.ts

1.1.1. string

1.1.2. number

1.1.3.boolean

1.1.4. null, undefined

2. Non-Primitive(비원시타입)

2.1. object

2.2. array

2.2.1. Tupel(튜플)

2.2.2.Optional Property(옵셔널프로퍼티)

2.3. any 와 unknown

2.3.1. any

2.3.2. unknown

2.3.3. 비교

3. 문제

3.1.

1. 문제: 문자열 변수 선언

2. 문제: 숫자 변수 선언

3. 문제: 불리언 변수 선언

4. 문제: 숫자 배열 선언

5. 문제: 문자열 배열 선언

6. 문제: 튜플 변수 선언

7. 문제: null 값 할당

8. 문제: undefined 값 할당

9. 문제: 객체 선언

🔗공식핸드북

7. 문제: `null` 값 할당

8. 문제: `undefined` 값 할당

🔗공식핸드북

7. 문제: `null` 값 할당

8. 문제: `undefined` 값 할당