변수의 값을 다른 값으로 복사

변수의 값을 다른 값으로 복사

JSON 객체를 값으로 하는 변수가 있습니다.저는 이 변수를 다른 변수에 직접 할당하여 같은 값을 공유합니다.작동 방식은 이렇습니다.

var a = $('#some_hidden_var').val(),
    b = a;

이것은 효과가 있고 둘 다 같은 값을 가집니다.나는 a를 사용합니다.mousemove할기트기트b제 앱을 통해서요.버튼을 클릭하면 되돌리려고 합니다.b으로,의로된을다다o로,된n에 저장된 을 의미합니다.a.

$('#revert').on('click', function(e){
    b = a;
});

에도 에도 mousemove 핸들러,,다 모두를 합니다.a그리고.b때, 에 만 만 에 b

저는 이 문제로 난처합니다!여기 뭐가 잘못됐나요?

중요한 것은 무엇인지 이해하는 것입니다.=자바스크립트의 operator는 실행하고 실행하지 않습니다.

=연산자는 데이터의 복사본을 만들지 않습니다.

=연산자가 동일한 데이터에 대한 새 참조를 만듭니다.

원래 코드를 실행한 후:

var a = $('#some_hidden_var').val(),
    b = a;

a그리고.b이제 같은 개체에 대해 두 개의 다른 이름입니다.

은 에 은 를 하든 하게 됩니다 의 하게 됩니다 하든 의 에 a수는그그b◦ 입니다.그들은 같은 물체입니다.

그래서 나중에 '뒤돌리려고' 하면b으로까지a다음 코드가 있는 개체:

b = a;

코드는 사실 아무 것도 하지 않습니다. 왜냐하면a그리고.b완전히 같은 것입니다.코드는 다음과 같습니다.

b = b;

분명히 아무 효과도 없을 겁니다

새 코드가 작동하는 이유는 무엇입니까?

b = { key1: a.key1, key2: a.key2 };

여기서는 다음을 사용하여 새 개체를 생성합니다.{...}객체 문자 그대로의그대로의 이 새 개체는 이전 이 새 개체는 이전 개체와 다릅니다.그래서 지금 설정하는 중입니다.b당신이 원하는 것을 하는 이 새로운 물체에 대한 언급으로서.

임의의 개체를 처리하려면 Armand의 답변에 나열된 개체 복제 기능과 같은 개체 복제 기능을 사용하거나 jQuery를 사용하므로 해당 기능을 사용하면 됩니다.이 함수는 객체의 얕은 복사 또는 깊은 복사를 만듭니다. (객체가 아닌 DOM 요소 복사를 위한 메서드와 혼동하지 마십시오.)

얕은 사본의 경우:

b = $.extend( {}, a );

또는 복사본을 깊게 작성할 수도 있습니다.

b = $.extend( true, {}, a );

얕은 사본과 깊은 사본의 차이점은 무엇입니까?얕은 복사본은 개체 리터럴로 새 개체를 만드는 코드와 유사합니다.원래 개체와 동일한 속성에 대한 참조를 포함하는 새 최상위 개체를 만듭니다.

개체에 숫자나 문자열과 같은 원시적인 유형만 포함되어 있다면, 복사를 깊게 하고 복사를 얕게 하면 바로 같은 작업을 수행할 수 있습니다.그러나 개체에 내부에 중첩된 다른 개체나 배열이 포함되어 있는 경우에는 중첩된 개체를 복사하지 않고 참조만 생성합니다.따라서 최상위 개체에서 발생했던 중첩 개체에서도 동일한 문제가 발생할 수 있습니다.예를 들어, 다음과 같은 객체가 주어집니다.

var obj = {
    w: 123,
    x: {
        y: 456,
        z: 789
    }
};

이 그 물체의 , 이 를 의 를 ,x새의이다다이의ey새fswetx원본의 개체:

var copy = $.extend( {}, obj );
copy.w = 321;
copy.x.y = 654;

이제 개체는 다음과 같이 나타납니다.

// copy looks as expected
var copy = {
    w: 321,
    x: {
        y: 654,
        z: 789
    }
};

// But changing copy.x.y also changed obj.x.y!
var obj = {
    w: 123,  // changing copy.w didn't affect obj.w
    x: {
        y: 654,  // changing copy.x.y also changed obj.x.y
        z: 789
    }
};

당신은 이것을 딥 카피로 피할 수 있습니다.심층 복사는 모든 중첩 개체 및 배열(및 Armand 코드의 Date)로 재귀하여 최상위 개체의 복사본을 만든 것과 동일한 방식으로 해당 개체의 복사본을 만듭니다.그래서 바뀝니다.copy.x.y을 주지 않을obj.x.y.

단답: 의문이 있다면, 아마도 당신은 깊은 사본을 원할 것입니다.

JSON 작품을 사용하는 것을 발견했지만 순환 참조를 위해 우리의 것을 봅니다.

var newInstance = JSON.parse(JSON.stringify(firstInstance));

newVariable = originalVariable.valueOf();

사용할 수 있는 물건에 대해서는b = Object.assign({},a);

질문은 이미 꽤 오랜 시간동안 해결되었지만, 미래의 참고를 위해 가능한 해결책은

b = a.slice(0);

a가 숫자와 문자열의 nested 배열이 아닌 경우에만 올바르게 작동하므로 주의하십시오.

그 이유는 간단합니다.자바스크립트는 참조를 사용하므로 할당할 때b = a에 대한 를 할당하고 .b서할때때할gs서a당신도 업데이트 하고 있습니다.b

스택 오버플로에서 발견한 것으로, 객체의 깊은 복사를 원하는 경우 이 메서드를 호출하면 향후 이러한 문제를 방지하는 데 도움이 될 것입니다.

function clone(obj) {
    // Handle the 3 simple types, and null or undefined
    if (null == obj || "object" != typeof obj) return obj;

    // Handle Date
    if (obj instanceof Date) {
        var copy = new Date();
        copy.setTime(obj.getTime());
        return copy;
    }

    // Handle Array
    if (obj instanceof Array) {
        var copy = [];
        for (var i = 0, len = obj.length; i < len; i++) {
            copy[i] = clone(obj[i]);
        }
        return copy;
    }

    // Handle Object
    if (obj instanceof Object) {
        var copy = {};
        for (var attr in obj) {
            if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
        }
        return copy;
    }

    throw new Error("Unable to copy obj! Its type isn't supported.");
}

나는 왜 답이 그렇게 복잡한지 이해할 수 없습니다.자바스크립트에서 프리미티브( 문자열, 숫자 등)는 값별로 전달되어 복사됩니다.배열을 포함한 개체는 참조로 전달됩니다.어떤 경우에도 'a'에 새 값이나 개체 참조를 할당해도 'b'는 변경되지 않습니다.그러나 'a'의 내용을 변경하면 'b'의 내용이 변경됩니다.

var a = 'a'; var b = a; a = 'c'; // b === 'a'

var a = {a:'a'}; var b = a; a = {c:'c'}; // b === {a:'a'} and a = {c:'c'}

var a = {a:'a'}; var b = a; a.a = 'c'; // b.a === 'c' and a.a === 'c'

위의 행 중 하나(한 번에 하나씩)를 노드 또는 브라우저 자바스크립트 콘솔에 붙여넣습니다.그런 다음 변수를 입력하면 콘솔에 값이 표시됩니다.

문자열 또는 입력 값의 경우 다음을 간단히 사용할 수 있습니다.

var a = $('#some_hidden_var').val(),
b = a.substr(0);

여기서 대부분의 답은 내장된 방법을 사용하거나 라이브러리/프레임워크를 사용하는 것입니다.이 간단한 방법은 잘 작동해야 합니다.

function copy(x) {
    return JSON.parse( JSON.stringify(x) );
}

// Usage
var a = 'some';
var b = copy(a);
a += 'thing';

console.log(b); // "some"

var c = { x: 1 };
var d = copy(c);
c.x = 2;

console.log(d); // { x: 1 }

당분간은 제가 직접 해결했습니다.원래 값에는 하위 속성이 2개만 있습니다.나는 새로운 객체를 다음의 속성으로 리폼했습니다.a그 다음엔 그들에게 할당했습니다.b. 이제 이벤트 핸들러 업데이트만 가능합니다.b, 그리고 나의 오리지널a그대로 있어요.

var a = { key1: 'value1', key2: 'value2' },
    b = a;

$('#revert').on('click', function(e){
    //FAIL!
    b = a;

    //WIN
    b = { key1: a.key1, key2: a.key2 };
});

이 정도면 잘 됩니다.위의 내용을 제외하고는 제 코드 어디에도 한 줄도 변경하지 않았고, 제가 원하는 대로 작동합니다.그러니까, 날 믿어요, 다른 건 아무것도 업데이트되지 않았어요a.

Angular 솔루션JS:

$scope.targetObject = angular.copy($scope.sourceObject)

언급URL : https://stackoverflow.com/questions/18829099/copy-a-variables-value-into-another