web/react

experimental_taintObjectReference

dev_been94 2024. 12. 16. 16:50
728x90
๋ฐ˜์‘ํ˜•

experimental_taintObjectReference

 

๐ŸŽฏ experimental_taintObjectReference๋ž€ ๋ฌด์—‡์ผ๊นŒ์š”?

React์˜ ์‹คํ—˜์  ๊ธฐ๋Šฅ ์ค‘ ํ•˜๋‚˜๋กœ, ํ˜„์žฌ๋Š” React ๋‚ด๋ถ€ ๊ฐœ๋ฐœ ๊ณผ์ •์—์„œ๋งŒ ์‚ฌ์šฉ๋˜๋Š” ๋„๊ตฌ์˜ˆ์š”.
React ๊ฐœ๋ฐœ ํŒ€์ด ํŠน์ • ์ƒํ™ฉ์—์„œ ๊ฐ์ฒด๋‚˜ ์ฐธ์กฐ(reference)๋ฅผ ์ถ”์ ํ•˜๊ฑฐ๋‚˜ ํ™•์ธํ•  ๋•Œ ํ™œ์šฉํ•˜๋Š” ๋””๋ฒ„๊น… ๋„๊ตฌ๋ผ๊ณ  ์ƒ๊ฐํ•˜๋ฉด ๋ผ์š”.

 

๐Ÿงฉ ๋ฐฐ๊ฒฝ: React์™€ ๊ฐ์ฒด ์ฐธ์กฐ ๋ฌธ์ œ

์ด ๊ฐœ๋…์„ ์ดํ•ดํ•˜๋ ค๋ฉด **"๊ฐ์ฒด ์ฐธ์กฐ(Object Reference)"**์— ๋Œ€ํ•ด ๋จผ์ € ๊ฐ„๋‹จํžˆ ์•Œ์•„์•ผ ํ•ด์š”.

๐Ÿ“ฆ ๊ฐ์ฒด ์ฐธ์กฐ๋ž€?

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์—์„œ ๊ฐ์ฒด๋Š” ๋ณ€์ˆ˜์— ๊ฐ’์„ ์ €์žฅํ•  ๋•Œ **๋ฉ”๋ชจ๋ฆฌ ์ฃผ์†Œ(์ฐธ์กฐ)**๋ฅผ ์ €์žฅํ•ฉ๋‹ˆ๋‹ค.
์˜ˆ๋ฅผ ๋“ค์–ด:

const obj1 = { name: 'ํ™๊ธธ๋™' };  
const obj2 = obj1; // obj2๋Š” obj1๊ณผ ๊ฐ™์€ ์ฐธ์กฐ๋ฅผ ๊ฐ€๋ฆฌํ‚ด  
obj2.name = '์ด์ˆœ์‹ ';  

console.log(obj1.name); // '์ด์ˆœ์‹ '

์—ฌ๊ธฐ์„œ obj2๋Š” obj1์˜ ๊ฐ์ฒด ์ฐธ์กฐ๋ฅผ ๊ทธ๋Œ€๋กœ ์‚ฌ์šฉํ–ˆ๊ธฐ ๋•Œ๋ฌธ์— obj2๋ฅผ ์ˆ˜์ •ํ•˜๋ฉด obj1๋„ ๋ฐ”๋€Œ๋Š” ๊ฑฐ์˜ˆ์š”.
React์—์„œ๋Š” ์ด๋Ÿฐ ๊ฐ์ฒด ์ฐธ์กฐ๊ฐ€ **์ƒํƒœ(State)**๋‚˜ Props๋ฅผ ๋‹ค๋ฃฐ ๋•Œ ํฐ ์ด์Šˆ๊ฐ€ ๋  ์ˆ˜ ์žˆ์–ด์š”.

 

๐Ÿ• ๋น„์œ ๋กœ ์ดํ•ดํ•˜๊ธฐ: ๋„์„œ๊ด€ ์ฑ…์žฅ ์ด์•ผ๊ธฐ

์—ฌ๋Ÿฌ๋ถ„์ด ๋„์„œ๊ด€์—์„œ ์ผํ•œ๋‹ค๊ณ  ์ƒ๊ฐํ•ด ๋ณด์„ธ์š”. ๐Ÿ“š

  1. ๊ฐ์ฒด๋ฅผ ์ฑ…์ด๋ผ๊ณ  ๊ฐ€์ •
    • ์ฑ…(๊ฐ์ฒด)์„ ์ฑ…์žฅ(๋ฉ”๋ชจ๋ฆฌ)์— ๊ฝ‚์•„๋‘๊ณ ,
    • ๋ˆ„๊ตฐ๊ฐ€ ์ฑ…์˜ ์œ„์น˜(์ฐธ์กฐ)๋ฅผ ๊ฐ€์ ธ๊ฐ€๋ฉด ๊ทธ ์ฑ…์— ์ง์ ‘ ๋ฉ”๋ชจ๋ฅผ ํ•˜๊ฑฐ๋‚˜ ๋‚ด์šฉ์„ ๋ฐ”๊ฟ€ ์ˆ˜ ์žˆ์–ด์š”.
  2. ๋ฌธ์ œ๊ฐ€ ์ƒ๊ธธ ๋•Œ
    • ๋ˆ„๊ตฐ๊ฐ€ ์ฑ…์„ ์ž˜๋ชป ๊ฑด๋“œ๋ฆฌ๊ฑฐ๋‚˜, ์–ด๋””์„œ ์ˆ˜์ •๋๋Š”์ง€ ์ถ”์ ํ•˜๊ธฐ ์–ด๋ ค์šธ ๋•Œ๊ฐ€ ์žˆ์–ด์š”.
    • ์ด๋Ÿด ๋•Œ **experimental_taintObjectReference**๋Š” ์ฑ…(๊ฐ์ฒด ์ฐธ์กฐ)์„ ์ถ”์ ํ•˜๊ฑฐ๋‚˜ ํ‘œ์‹œํ•ด์„œ ๋ˆ„๊ฐ€, ์–ด๋–ป๊ฒŒ ์ˆ˜์ •ํ–ˆ๋Š”์ง€ ํ™•์ธํ•˜๋Š” ์—ญํ• ์„ ํ•ด์š”.

๐Ÿ› ๏ธ React์˜ ์‹คํ—˜์  ๊ธฐ๋Šฅ: ๋””๋ฒ„๊น… ๋„๊ตฌ

React์—์„œ๋Š” ์ƒํƒœ๋‚˜ Props๊ฐ€ ๋ถˆํ•„์š”ํ•˜๊ฒŒ ๋ณ€๊ฒฝ๋˜๊ฑฐ๋‚˜ ์˜ˆ์ƒ์น˜ ๋ชปํ•œ ๋™์ž‘์ด ๋ฐœ์ƒํ•  ๋•Œ ๋””๋ฒ„๊น…์ด ์–ด๋ ค์šธ ์ˆ˜ ์žˆ์–ด์š”.
์ด๋Ÿฐ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด experimental_taintObjectReference ๊ฐ™์€ ์ถ”์  ๋„๊ตฌ๊ฐ€ ์‹คํ—˜์ ์œผ๋กœ ๋„์ž…๋œ ๊ฑฐ์˜ˆ์š”.

๐Ÿšจ ํ˜„์žฌ ์ƒํƒœ

**experimental_taintObjectReference**๋Š” ์ผ๋ฐ˜ ๊ฐœ๋ฐœ์ž๋“ค์ด ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋Šฅ์ด ์•„๋‹ˆ๊ณ ,
React ํŒ€์ด React ๋‚ด๋ถ€์ ์œผ๋กœ ๋””๋ฒ„๊น…ํ•˜๊ฑฐ๋‚˜ ์„ฑ๋Šฅ ์ตœ์ ํ™”๋ฅผ ์‹คํ—˜ํ•  ๋•Œ ์‚ฌ์šฉํ•˜๋Š” ๋„๊ตฌ์ž…๋‹ˆ๋‹ค.

 

๐ŸŒŸ ์ด ๊ฐœ๋…์„ ๊ธฐ์–ตํ•ด์•ผ ํ• ๊นŒ?

์ง€๊ธˆ์€ ์ดˆ๋ณด์ž๊ฐ€ ๊ผญ ์•Œ์•„์•ผ ํ•  ๊ฐœ๋…์€ ์•„๋‹ˆ์—์š”.
React ํŒ€์˜ ์‹คํ—˜์  ๊ธฐ๋Šฅ์ด๊ธฐ ๋•Œ๋ฌธ์— ๋‚˜์ค‘์— ๋” ๋ฐœ์ „ํ•ด์„œ ๊ณต์‹ ๊ธฐ๋Šฅ์œผ๋กœ ์ฑ„ํƒ๋  ์ˆ˜๋„ ์žˆ์–ด์š”.

๊ทธ๋•Œ๊ฐ€ ๋˜๋ฉด ์šฐ๋ฆฌ๊ฐ€ ์ƒํƒœ๋‚˜ ์ฐธ์กฐ๋ฅผ ๋” ์‰ฝ๊ฒŒ ์ถ”์ ํ•˜๊ณ  ๋””๋ฒ„๊น…ํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋  ๊ฑฐ์˜ˆ์š”.

 

๐ŸŽ‰ ๋งˆ๋ฌด๋ฆฌ

๊ฐ„๋‹จํžˆ ์ •๋ฆฌํ•˜๋ฉด:
**experimental_taintObjectReference**๋Š” React์˜ ์‹คํ—˜์  ๊ธฐ๋Šฅ ์ค‘ ํ•˜๋‚˜๋กœ, ๊ฐ์ฒด ์ฐธ์กฐ๋ฅผ ์ถ”์ ํ•˜๊ณ  ๋ฌธ์ œ๋ฅผ ๋””๋ฒ„๊น…ํ•˜๋Š” ๋„๊ตฌ์ž…๋‹ˆ๋‹ค.

ํ˜„์žฌ๋Š” React ํŒ€์ด ๊ฐœ๋ฐœ ๊ณผ์ •์—์„œ๋งŒ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์œผ๋‹ˆ, ๋„ˆ๋ฌด ๊ฑฑ์ •ํ•˜์ง€ ์•Š์œผ์…”๋„ ๋ผ์š”. ๐Ÿ˜Š

728x90
๋ฐ˜์‘ํ˜•