浅谈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 相关文章推荐
玩转jQuery按钮 请告诉我你最喜欢哪些?
Jan 08 Javascript
JavaScript 高级篇之函数 (四)
Apr 07 Javascript
Jquery获取复选框被选中值的简单方法
Jul 04 Javascript
jQuery文件上传插件Uploadify使用指南
Jun 05 Javascript
jQuery 写的简单打字游戏可以提示正确和错误的次数
Jul 01 Javascript
JQuery datepicker 用法详解
Dec 25 Javascript
Vue.js绑定HTML class数组语法错误的原因分析
Oct 19 Javascript
laydate 显示结束时间不小于开始时间的实例
Aug 11 Javascript
Node.js如何使用Diffie-Hellman密钥交换算法详解
Sep 05 Javascript
vue的keep-alive中使用EventBus的方法
Apr 23 Javascript
javascript面向对象程序设计实践常用知识点总结
Jul 29 Javascript
浅析VUE防抖与节流
Nov 24 Vue.js
说说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 正则 过滤html 的超链接
2009/06/02 PHP
PHP中对用户身份认证实现两种方法
2011/06/04 PHP
下拉列表多级联动dropDownList示例代码
2013/06/27 PHP
php获得文件大小和文件创建时间的方法
2015/03/13 PHP
ext form 表单提交数据的方法小结
2008/08/08 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
2013/01/27 Javascript
js动画效果制件让图片组成动画代码分享
2014/01/14 Javascript
javascript中的self和this用法小结
2014/02/08 Javascript
javascript对中文按照拼音排序代码
2014/08/20 Javascript
JS函数this的用法实例分析
2015/02/05 Javascript
js实现的简洁网页滑动tab菜单效果代码
2015/08/24 Javascript
学习JavaScript设计模式之策略模式
2016/01/12 Javascript
Node.js DES加密的简单实现
2016/07/07 Javascript
JS树形菜单组件Bootstrap TreeView使用方法详解
2016/12/21 Javascript
Vue组件中prop属性使用说明实例代码详解
2018/05/31 Javascript
vue使用echarts图表的详细方法
2018/10/22 Javascript
详解如何构建Promise队列实现异步函数顺序执行
2018/10/23 Javascript
nodejs使用async模块同步执行的方法
2019/03/02 NodeJs
layui 上传文件_批量导入数据UI的方法
2019/09/23 Javascript
Vue项目打包部署到iis服务器的配置方法
2019/10/14 Javascript
[38:30]2014 DOTA2国际邀请赛中国区预选赛 LGD-GAMING VS CIS 第一场2
2014/05/24 DOTA
web.py获取上传文件名的正确方法
2014/08/26 Python
python版学生管理系统
2018/01/10 Python
Python HTML解析模块HTMLParser用法分析【爬虫工具】
2019/04/05 Python
PyCharm专业最新版2019.1安装步骤(含激活码)
2019/10/09 Python
详解Python3中的 input() 函数
2020/03/18 Python
Python如何实现机器人聊天
2020/09/10 Python
CSS3 RGBA色彩模式使用实例讲解
2016/04/26 HTML / CSS
微软俄罗斯官方网站:Microsoft俄罗斯
2016/09/18 全球购物
Does C# support multiple inheritance? (C#支持多重继承吗)
2012/01/04 面试题
外贸主管求职简历的自我评价
2013/10/23 职场文书
纪念建党演讲稿范文
2014/01/13 职场文书
党员组织生活会发言材料
2014/10/17 职场文书
入党宣誓仪式主持词
2015/06/29 职场文书
《水上飞机》教学反思
2016/02/20 职场文书
又涨知识了,自律到底多重要?
2019/06/27 职场文书