浅谈angular.copy() 深拷贝


Posted in Javascript onSeptember 14, 2017

因为项目中需要拷贝,查阅angularjs API文档,发现对angular.copy() 的解释:

复制一个对象或者一个数组(好吧,万物皆对象,数组也是一个对象)。

1> 如果省略了destination,一个新的对象或数组将会被创建出来;
2> 如果提供了destination,则source对象中的所有元素和属性都会被复制到destination中;
3> 如果source不是对象或数组(例如是null或undefined), 则返回source;
4> 如果source和destination类型不一致,则会抛出异常。 注意:这个是单纯复制覆盖,不是类似继承。

使用方法:

angular.copy(source, [destination]);

参数:

参数名称 参数类型 描述
source * 被copy的对象. 可以使任意类型, 包括null和undefined.
destination (optional) Object,array copy去的目的地. 可以省略, 如果不省略, 其必须和source是同类

返回值:

返回复制或更新后的对象

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
  </head>

  <body ng-app="copyApp">
    <div ng-controller="CopyController">
      <form novalidate class="simple-form">
        姓名: <input type="text" ng-model="user.name" /><br /> 
        年龄:<input type="number" ng-model="user.age" /><br /> 
        邮箱: <input type="email" ng-model="user.email" /><br />
        性别:<input type="radio" ng-model="user.gender" value="male" /> 男
        <input type="radio" ng-model="user.gender" value="female" /> 女
        <br />
        <button ng-click="reset()">重置</button>
        <button ng-click="update(user)">保存(拷贝)</button>
      </form>
      <pre>form = {{user | json}}</pre>
      <pre>master = {{master | json}}</pre>
    </div>

    <script>
      angular.module('copyApp', [])
        .controller('CopyController', ['$scope', function($scope) {
          $scope.master = {};
          $scope.update = function(user) {
            $scope.master = angular.copy(user);
            console.log($scope.master);
          };
          $scope.reset = function() {
            angular.copy($scope.user, $scope.master);
            console.log($scope.master);// Object { }
            console.log($scope.user); //undefined
          };
          $scope.reset();
        }]);
    </script>
  </body>

</html>

效果图

浅谈angular.copy() 深拷贝

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype使用指南之base.js
Jan 10 Javascript
jQuery父级以及同级元素查找介绍
Sep 04 Javascript
jQuery Ajax()方法使用指南
Nov 19 Javascript
原生javascript实现隔行换色
Jan 04 Javascript
js实现图片无缝滚动
Dec 23 Javascript
JS基于clipBoard.js插件实现剪切、复制、粘贴
May 03 Javascript
JS实现中文汉字按拼音排序的方法
Oct 09 Javascript
JS同步、异步、延迟加载的方法
May 05 Javascript
详解javascript中的变量提升和函数提升
May 24 Javascript
angular4中*ngFor不能对返回来的对象进行循环的解决方法
Sep 12 Javascript
React通过redux-persist持久化数据存储的方法示例
Feb 14 Javascript
jQuery 隐藏/显示效果函数用法实例分析
May 20 jQuery
说说AngularJS中的$parse和$eval的用法
Sep 14 #Javascript
用JS编写一个函数,返回数组中重复出现过的元素(实例)
Sep 14 #Javascript
日期时间范围选择插件:daterangepicker使用总结(必看篇)
Sep 14 #Javascript
详解React Native顶|底部导航使用小技巧
Sep 14 #Javascript
Angularjs 1.3 中的$parse实例代码
Sep 14 #Javascript
浅谈JavaScript中的属性:如何遍历属性
Sep 14 #Javascript
基于node.js express mvc轻量级框架实践
Sep 14 #Javascript
You might like
PHP逐行输出(ob_flush与flush的组合)
2012/02/04 PHP
php7 list()、session及其他模块的修改实例分析
2020/05/25 PHP
Javascript 判断 object 的特定类转载
2007/02/01 Javascript
JQuery+Ajax无刷新分页的实例代码
2014/02/08 Javascript
了不起的node.js读书笔记之例程分析
2014/12/22 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形菜单
2015/11/30 Javascript
jquery日历插件e-calendar升级版
2016/11/10 Javascript
vue下拉菜单组件(含搜索)的实现代码
2018/11/25 Javascript
微信小程序image图片加载完成监听
2019/08/31 Javascript
webpack是如何实现模块化加载的方法
2019/11/06 Javascript
在vue-cli中引入lodash.js并使用详解
2019/11/13 Javascript
[01:05:40]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS DT第三场
2014/05/24 DOTA
基于Python实现的扫雷游戏实例代码
2014/08/01 Python
Python使用reportlab将目录下所有的文本文件打印成pdf的方法
2015/05/20 Python
Python正则匹配判断手机号是否合法的方法
2020/12/09 Python
django的分页器Paginator 从django中导入类
2019/07/25 Python
Django ORM实现按天获取数据去重求和例子
2020/05/18 Python
Python内置异常类型全面汇总
2020/05/28 Python
python属于解释语言吗
2020/06/11 Python
详解H5本地储存Web Storage
2017/07/03 HTML / CSS
用HTML5实现手机摇一摇的功能的教程
2012/10/30 HTML / CSS
HQhair美国/加拿大:英国化妆品、美容及美发产品商城
2019/04/15 全球购物
怀旧香味蜡烛:Homesick
2019/11/02 全球购物
英国名牌男装店:Standout
2021/02/17 全球购物
Jar包的作用是什么
2014/03/30 面试题
C++如何引用一个已经定义过的全局变量
2014/08/25 面试题
linux系统都有哪些运行级别
2016/03/26 面试题
大学毕业生通用求职信
2013/09/28 职场文书
年终晚会主持词
2014/03/25 职场文书
副乡长民主生活会个人对照检查材料思想汇报
2014/10/01 职场文书
JS新手入门数组处理的实用方法汇总
2021/04/07 Javascript
python办公自动化之excel的操作
2021/05/23 Python
OpenCV-Python实现轮廓拟合
2021/06/08 Python
python实现简单聊天功能
2021/07/07 Python
10大幻兽系恶魔果实 蝙蝠果实上榜,第一自愈能力强
2022/03/18 日漫
基于Python实现股票收益率分析
2022/04/02 Python