{"id":16993,"date":"2026-07-25T10:09:51","date_gmt":"2026-07-25T01:09:51","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=16993"},"modified":"2026-07-25T10:12:51","modified_gmt":"2026-07-25T01:12:51","slug":"typescript-%ed%95%a8%ec%88%98-%eb%82%b4%ec%97%90%ec%84%9c-this-%ec%84%a0%ec%96%b8%ed%95%98%ea%b8%b0","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=16993","title":{"rendered":"TypeScript, \ud568\uc218 \ub0b4\uc5d0\uc11c  this  \uc120\uc5b8\ud558\uae30"},"content":{"rendered":"<p>\uc544\ub798\uc640 \uac19\uc740 \ucf54\ub4dc\uac00 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">\r\ninterface User {\r\n  id: number;\r\n  name: string;\r\n  admin: boolean;\r\n}\r\n\r\ninterface DB {\r\n  filterUsers(filter: (\/*this: User*\/) => boolean): User[];\r\n}\r\n\r\nclass UserDB implements DB {\r\n  private users: User[] = [\r\n    { id: 1, name: \"Alice\", admin: true },\r\n    { id: 2, name: \"Bob\", admin: false },\r\n    { id: 3, name: \"Charlie\", admin: true },\r\n    { id: 4, name: \"David\", admin: false },\r\n  ];\r\n\r\n  filterUsers(filter: (\/*this: User*\/) => boolean): User[] {\r\n    const result: User[] = [];\r\n\r\n    for (const user of this.users) {\r\n      \/\/ filter \ud568\uc218\uc758 this\ub97c \ud604\uc7ac user\ub85c \uc9c0\uc815\ud558\uc5ec \ud638\ucd9c\r\n      if (filter.call(user)) {\r\n        result.push(user);\r\n      }\r\n    }\r\n\r\n    return result;\r\n  }\r\n}\r\n\r\nfunction getDB(): DB {\r\n  return new UserDB();\r\n}\r\n\r\n\/\/ ------------------------\r\n\/\/ \uc0ac\uc6a9 \uc608\uc81c\r\n\/\/ ------------------------\r\n\r\nconst db = getDB();\r\n\r\nconst admins = db.filterUsers(function (this: User) {\r\n  return this.admin;\r\n});\r\n\r\nconsole.log(admins);\r\n<\/pre>\n<p>\uc911\uc694\ud55c \uac83\uc740 43\ubc88\uc9f8 \uc904\uc758 \uc778\uc790\ub85c \ubc1b\uc740 \ud568\uc218\uc758 \uc778\uc790\uac00 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">this: User<\/code>\ub77c\ub294 \uac83\uc785\ub2c8\ub2e4. \uc778\uc790\ub85c \ubc1b\uc740 \uc774 \ud568\uc218\ub294 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">filter<\/code>\ub77c\ub294 \uc774\ub984\uc73c\ub85c 24\ubc88\uc9f8 \uc904\uc5d0\uc11c <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">filter.call(user)<\/code>\ub85c \ud638\ucd9c\ub418\uace0 \uc788\uc2b5\ub2c8\ub2e4. 43\ubc88\uc9f8\uc758 \ucf54\ub4dc\ub294 Javascript\uc5d0\uc11c\ub294 \ud5c8\ub77d\ud558\uc9c0 \uc54a\ub294 \ubb38\ubc95\uc785\ub2c8\ub2e4. Type\ub97c \ud56d\uc0c1 \ud655\uc778\ud574\uc57c\ub9cc \ud558\ub294 TypeScript\uc5d0\uc11c\ub294 \uc774 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">this: User<\/code>\ub97c \ud1b5\ud574 \uc778\uc790\ub85c \ubc1b\ub294 \ud568\uc218 \ub0b4\ubd80\uc5d0\uc11c\uc758 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">this<\/code>\uc758 \ud0c0\uc785\ub3c4 \ud655\uc778\uc744 \ud574\uc57c\ud558\ubbc0\ub85c \uac1c\ubc1c\uc790\uac00 \uc9c1\uc811 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">this<\/code>\uc758 \ud0c0\uc785\uc744 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">User<\/code>\ub77c\uace0 \uba85\uc2dc \ud574\uc900 \uac83\uc785\ub2c8\ub2e4. <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">this: User<\/code>\uac00 \uc5c6\uc744 \uacbd\uc6b0 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">this<\/code>\ub294 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">any<\/code> \ud0c0\uc785\uc73c\ub85c \ucd94\ub860\ub420 \uac83\uc774\uae30 \ub54c\ubb38\uc785\ub2c8\ub2e4. \uc774\ub807\uac8c \ub41c \uc774\uc720\ub294 <code class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">filter.call(user)<\/code>\uc640 \uac19\uc740 \ud615\ud0dc\ub85c \ud638\ucd9c\ub418\uace0 \uc788\uae30 \ub54c\ubb38\uc778\ub370, \uc774\ub7ec\ud55c \ud638\ucd9c \ubc29\uc2dd\uc740 \uc624\ub798\ub41c \ubc29\uc2dd\uc785\ub2c8\ub2e4. \ud558\uc9c0\ub9cc \uc9c0\uae08\ub3c4 \ub9e4\uc6b0 \ub9ce\uc774 \uc0ac\uc6a9\ub418\uace0 \uc788\ub294 \ubc29\uc2dd\uc774\uae30\ub3c4 \ud569\ub2c8\ub2e4. \uadf8\ub7fc \uc9c0\uae08 \ubc29\uc2dd(\uc815\ud655\ud788\ub294 \uc81c\uac00 \uc8fc\uc7a5\ud558\ub294 \ubc29\uc2dd)\uc73c\ub85c \ubc14\uafbc\ub2e4\uba74 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"typescript\">\r\ninterface User {\r\n  id: number;\r\n  name: string;\r\n  admin: boolean;\r\n}\r\n\r\ninterface DB {\r\n  filterUsers(filter: (user: User) => boolean): User[];\r\n}\r\n\r\nclass UserDB implements DB {\r\n  private users: User[] = [\r\n    { id: 1, name: \"Alice\", admin: true },\r\n    { id: 2, name: \"Bob\", admin: false },\r\n    { id: 3, name: \"Charlie\", admin: true },\r\n    { id: 4, name: \"David\", admin: false },\r\n  ];\r\n\r\n  \/\/ filterUsers(filter: (this: User) => boolean): User[] {\r\n  filterUsers(filter: (user: User) => boolean): User[] {\r\n    const result: User[] = [];\r\n\r\n    for (const user of this.users) {\r\n      \/\/ filter \ud568\uc218\uc758 \uc778\uc790\uc5d0 \uc9c1\uc811 \ud604\uc7ac user\ub97c \uc9c0\uc815\ud558\uc5ec \ud638\ucd9c\r\n      if (filter(user)) {\r\n        result.push(user);\r\n      }\r\n    }\r\n\r\n    return result;\r\n  }\r\n}\r\n\r\nfunction getDB(): DB {\r\n  return new UserDB();\r\n}\r\n\r\n\/\/ ------------------------\r\n\/\/ \uc0ac\uc6a9 \uc608\uc81c\r\n\/\/ ------------------------\r\n\r\nconst db = getDB();\r\n\r\nconst admins = db.filterUsers((user: User) => {\r\n  return user.admin;\r\n});\r\n\r\nconsole.log(admins);\r\n<\/pre>\n<p>\uba85\ud655\ud569\ub2c8\ub2e4. \uc800\ub294 \uc774 \ubc29\uc2dd\uc744 \uc120\ud638\ud558\uc9c0\ub9cc.. \ud604\uc7ac \uc81c\uacf5\ub418\ub294 \ub9e4\uc6b0 \uc720\uba85\ud55c \ub77c\uc774\ube0c\ub7ec\ub9ac\ub4e4\uc774 \uc774 \ubc29\uc2dd\uc73c\ub85c \uc81c\uacf5\ub418\uc9c0 \uc54a\uc73c\ubbc0\ub85c \uc804\uc790\uc758 \ubc29\uc2dd\ub3c4 \uc54c\uc544\ub450\uace0 \uc788\uc5b4\uc57c \ud569\ub2c8\ub2e4.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\uc544\ub798\uc640 \uac19\uc740 \ucf54\ub4dc\uac00 \uc788\uc2b5\ub2c8\ub2e4. interface User { id: number; name: string; admin: boolean; } interface DB { filterUsers(filter: (\/*this: User*\/) => boolean): User[]; } class UserDB implements DB { private users: User[] = [ { id: 1, name: &#8220;Alice&#8221;, admin: true }, { id: 2, name: &#8220;Bob&#8221;, admin: false }, { id: 3, name: &#8220;Charlie&#8221;, &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.gisdeveloper.co.kr\/?p=16993\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;TypeScript, \ud568\uc218 \ub0b4\uc5d0\uc11c  this  \uc120\uc5b8\ud558\uae30&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[157],"tags":[],"class_list":["post-16993","post","type-post","status-publish","format-standard","hentry","category-typescript"],"_links":{"self":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16993","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16993"}],"version-history":[{"count":5,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16993\/revisions"}],"predecessor-version":[{"id":16999,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16993\/revisions\/16999"}],"wp:attachment":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16993"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=16993"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=16993"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}