"for (element in window)"를 사용하여 변수를 javaScript로 변경하려고합니다 : 왜 undefined를 반환합니까?

Question

html 캔버스 shenanigans에 대한 단추 개체를 프로그래밍하려고합니다. 나는이 작업을 수행 할 때

but_endTurn = ui_button({ 
    context: ctx, 
    hpos: 50, 
    vpos: 50, 
    width: 80, 
    height: 30, 
    radius: 5, 
    txt: "End Turn" 
}); 

이, 함수가 동일하지 : 그런 다음

gameFont = "Calibri";      // Default button font 
fontSize = 12;       // Default button font size in px 
fontColour = "white";     // Default button font colour 

function ui_button(options) { 
    var that = {}; 

    that.context = options.context; 
    that.hpos = options.hpos; 
    that.vpos = options.vpos; 
    that.width = options.width; 
    that.height = options.height; 
    that.radius = options.radius; 
    that.txt = options.txt; 
    that.fontColour = options.fontColour; 
    that.fontSize = options.fontSize; 
    that.font = options.font; 

    // Check if any of our keys weren't specified. 
    for (i=0;i<Object.keys(that).length;i++) { 
     // If the value is empty 
     if (!Object.values(that)[i]) { 
      // Then search the ENTIRE window for variables 
      for (element in window) { 
       // If the current element shares a name with the key we tested 
       if (element == Object.keys(that)[i]) { 
        // Replace this object's value with the global one 
        alert("Changing "+Object.keys(that)[i]+" with value of "+Object.values(that)[i]+" into "+eval(element)); 
        alert(eval(element)); 
        var ttt = eval(element)[0]; 
        alert("ttt:"+ttt); 
        Object.values(that)[i] = ttt; 
        alert(Object.values(that)[i]); 
        alert("Internal var "+Object.keys(that)[i]+" now has value of "+Object.values(that)[i]+" from "+eval(element)); 
       } 
      }    
     } 
    } 

/* blahblah, more function stuff for the object */ 

return that 
} 

, 나는 다음과 같은 정의에 이러한 개체 중 하나를 생산 해요 : 저는 여기에 후 설명 할 것입니다 내 코드입니다 정의되지 않은 모든 변수에 대한 처리 : fontColour을 예로 들어 봅시다.

fontColour이 정의되지 않았 음을 알게되면, window의 요소를 찾아서 fontColour라는 변수를 찾습니다.

찾아냅니다.

alert(eval(element)); 

정확하게이 값은 "white"입니다.

다음, 나는 그것의 변수를 만들 :

는

var ttt = eval(element)[0]; 
alert("ttt:"+ttt); 

이 또한 제대로 디버그 경고에 "white" 상태.

지금까지는 좋았습니다. 그럼 난 ttt으로 변수를 정의 (내가 평가 (요소로 직선을 정의 할 때 같은 일이 발생) [0])

   Object.values(that)[i] = ttt; 
       alert(Object.values(that)[i]); 
       alert("Internal var "+Object.keys(that)[i]+" now has value of "+Object.values(that)[i]+" from "+eval(element)); 

그러나 항상 경고 반환 Object.values(that)[i]에 대한 "undefined"! 두 번째 경고의 다른 변수는 항상 올바르게 표시됩니다.

아무도 내가 이것이 왜 그리고/또는 해결책을 제공하는지 파악할 수 있습니까?

감사합니다.

Answer 1

Object.values은 원래 개체 속성에 대한 참조가 아닌 that의 모든 값을 포함하는 새로 만든 배열을 반환하기 때문에 undefined을 반환합니다. 따라서 ttt의 내용을 임시 배열로 정리하면됩니다.

가능한 해결 방법 :

that[Object.keys(that)[i]] = window[element]; 

https://codepen.io/anon/pen/jYWOOj

---

그러나 나는 창 개체를 반복도 내가 평가 후면 사용하고자하지 않을 것입니다.무엇과 같이, 모든 기본 설정을 포함하는 다른 전역 객체를 사용을 중지 : https://codepen.io/anon/pen/LeGPrb

---

당신은 정말 이런 열쇠 반복 추천 할 것입니다 윈도우 객체에서 별도로 전역 변수를 정의하려면 :

for (let element in that) { 
    if (typeof that[element] === 'undefined' && window[element]) { 
    that[element] = window[element]; 
    } 
} 

https://codepen.io/anon/pen/zprYBo