속성 만 전달하여 JS 객체의 속성을 수정 하시겠습니까?

Question

높이와 너비라는 두 개의 매개 변수를 허용하는 플러그인을 만들고 있습니다. 이 플러그인의 소비자들은 너비/높이의 이름이 다를 수 있습니다 사각형 객체 또는 사각형 객체 또는 다각형 객체 등이있을 수 있습니다 : 나는 기능을 구축하기 위해 노력하고있어

var square = { 
    width: 200, 
    height: 200 
} 

var rectangle = { 
    Width: 200, 
    tall: 200 
} 

var polygon = { 
    w: 200, 
    h: 200 
} 

을 그 너비/높이 매개 변수를 받아들이고 부모 개체가 업데이트되도록 수정합니다. 이런 식으로 뭔가가 :

var alterStuff = function (width, height){ 
    width = 200; 
    height = 200; 
}; 

var obj = {width: "28", height: "34"}; 

alterStuff(obj.width, obj.height); 

alert(obj.width); 

목표는 소비자가 두 가지 기본 유형에 전달할 수 있으며, alterStuff 기능은 객체를 업데이트 할 것입니다.

이것을 달성하기 위해 어떤 패턴을 사용할 수 있습니까? 지금은 obj 속성이 업데이트되지 않습니다. 경고에 "28"이 표시되지만 속성 이름이 해당 개체에 있을지 모르기 때문에 개체에 전달하지 않고 "200"을보고 싶습니다. 모든 경우에.

Answer 1

짧은 답 : 할 수 없습니다!

함수에 뭔가를 전달하면 값을 전달합니다. 예를 들어 5와 같이 원시 값이면 함수에 5를 전달합니다. 그것이 객체라면 실제로는 객체에 대한 참조이며 그 참조를 전달합니다. 예를 들어 45px 값을 가진 obj.width을 전달하면 해당 문자열을 함수에 전달하고 obj에 대한 연결이 전혀 없음을 의미합니다. 추측 "에 당신이 최고의 노력을 만들 수있는 특정 상황에서

function change(obj, key, val) { 
    obj[key] = val; 
} 

var obj = { width : 5 }; 
change(obj, 'width', 10); 

---

:

객체에 속성을 업데이트 할 수있는 유일한 방법은 개체 자체 및 속성의 이름을 전달하는 것입니다 "개체의 키에서 속성 이름. 다음 예제에서 widthKey 및 heightKey는 선택적이므로 라이브러리 함수의 사용자에게 올바르게 작동하는 객체가 있으면 전달할 필요가 없습니다. 그렇지 않으면, 그는 그들을 통과해야합니다.

function updateSize(object, width, height, opt_widthKey, opt_heightKey) { 
    // potential width properties: 
    var widths = ['width', 'Width', 'w']; 
    // potential height properties: 
    var heights = ['height', 'Height', 'h']; 

    var widthKey = opt_widthKey || getPropertyName(object, widths); 
    if (!widthKey) throw new Error('Can not guess width property'); 

    var heightKey = opt_heightKey || getPropertyName(object, heights); 
    if (!heightKey) throw new Error('Can not guess height property'); 

    object[widthKey] = width; 
    object[heightKey] = height; 
} 

function getPropertyName(object, properties) { 
    for (var i=0; i<properties.length; i++) { 
    if (object.hasOwnProperty(properties[i])) 
     return properties[i]; 
    } 
} 

// usage: 

var obj = { width : 5, Height : 10 }; 
var notGood = { tall : 20, wide : 40 }; 

updateSize(obj, 100, 200); 
updateSize(notGood, 100, 200, 'wide', 'tall'); 

Answer 2

당신은 오히려 그 속성보다는 개체 자체를 통과해야합니다 :

var alterStuff = function (obj){ 
    obj.width = 200; 
    obj.height = 200; 
}; 

var obj = {width: "28", height: "34"}; 

alterStuff(obj); 

당신은 this article을 읽을 수 있습니다.

Answer 3

나는 개체를 전달하지 않고 원하는 것을 할 수있는 좋은 방법이 있다고 생각하지 않습니다.아마도 당신은 발신자가 올바른 위치에 다시로드에 대한 책임을 질 것 2 멤버 배열을 반환 할 수 : 그래서 지금

var alterStuff = function(width, height, callback) { 
    // note: you may want to include some checks for undefined and that callback is a function 
    callback(+width *2, +height * 2); 
} 

alterStuff(obj.width, obj.height, function(width, height) { 
    obj.width = width; 
    obj.height = height; 
}); 

:

var alterStuff = function(width, height) { 
    return [+width * 2, +height * 2]; // for example 
} 

var obj = {width: "28", height: "34"}; 

var newValues = alterStuff(obj.width, obj.height); 
obj.width = newValues[0]; 
obj.height = newValues[1]; 

또는, 당신은 발신자가 콜백 기능을 제공 할 수 내가 가진 경우 :

var rectangle = { 
    Width: 200, 
    tall: 200 
} 

나는이 같은 alterStuff를 호출 할 수

alterStuff(rectangle.Width, rectangle.tall, function(Width, tall) { 
    rectangle.Width = Width; 
    rectangle.tall = tall; 
}); 

그리고 "width"와 "height"속성에 대해 내가 선택한 이름은 호출자 선택입니다.

또는 Tibos의 대답은 함수를 호출 할 때 키를 전달하는 또 다른 방법입니다.