>  기사  >  웹 프론트엔드  >  JS에서 얕은 복제와 깊은 복제의 차이점은 무엇입니까?

JS에서 얕은 복제와 깊은 복제의 차이점은 무엇입니까?

清浅
清浅원래의
2018-11-15 15:06:314253검색

이 기사는 JavaScript 복제에 대한 중요한 지식 포인트를 공유하며 모든 사람의 학습에 도움이 되기를 바랍니다.

JavaScript에는 얕은 복제와 깊은 복제의 두 가지 유형이 있습니다. 값을 먼저 탐색하여 원래 값인지 참조 값인지를 직접 복사합니다. 먼저 참조 값이 객체인지 배열인지 확인한 다음 복제합니다. Undefine, Null, Boolean, Number, String 등을 원시값(Primitive Value)이라고 합니다

참조값: 객체 배열 함수 등의 값을 참조값이라고 합니다

Shallow cloning

주로 해당 데이터의 주소를 해당 값에 할당합니다. 변수이지만 해당 변수에 특정 값을 할당하지는 않습니다. 변수 데이터가 변경됨에 따라 변경됩니다

 <script>
    var obj={
      name:"张三",
      age:18,
      sex:"male",
       grade:[&#39; Math:90&#39;,&#39;English:88&#39;,&#39;Chinese:80&#39;]
    }
    var obj1={}
    function clone(origin,target){
      var target=target||{};
      for(var prop in origin){
        target[prop]=origin[prop];
      }//防止用户不传target对象,给了参数就直接用,不给就当空对象,
     return target;
    }
    clone(obj,obj1);
  </script>

결과

Image 12.jpgobj1이 obj의 등급에 값을 추가하면 값이 변경됩니다. ofj1의 등급도 변경되었습니다

Deep cloning

은 해당 변수에 데이터를 할당하여 새로운 데이터가 생성되고, 원본 데이터가 변경되어도 새 데이터에는 영향을 미치지 않습니다

<script type="text/javascript">
var obj={
      name:"张三",
      age:18,
      sex:"male",
       grade:[&#39; Math:90&#39;,&#39;English:88&#39;,&#39;Chinese:80&#39;]
    }
    var obj1={}
    function deepClone(origin,target){
	var target=target||{},
	toStr=Object.prototype.toString,//简化代码
	arrStr="[Object Array]";
	for(var prop in origin){//从原始 origin 拷贝到 target
    		if(origin.hasOwnProperty(prop)){///先判断是不是原型上的属性,如果是false 就是原型上的
    	   {
      	if(typeof(origin[prop])!== "null" && typeof (origin[prop]) ==&#39;object&#39;)
      	{
    			if(toStr.call(origin[prop])==arrStr){
    				target[prop]=[];
    			}//数组对象
    			else{
    				target[prop]={};
    			}//对象
//
    			deepClone(origin[prop],target[prop]);
    		}
    		else{
    			target[prop]=origin[prop];
    		}
    	}
    }
     return target;
 }
	</script>

result

Image 13.jpg obj1은 obj의 값을 복제합니다. obj의 grade에 값을 추가하면 obj1의 grade 값은 변경되지 않습니다.

요약: 위 내용이 이 글의 내용입니다. 다들 배우고 있어요.


위 내용은 JS에서 얕은 복제와 깊은 복제의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.