浅谈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学习2 选择器的使用说明
Feb 07 Javascript
js压缩工具 yuicompressor 使用教程
Mar 31 Javascript
QUnit jQuery的TDD框架
Nov 04 Javascript
js验证输入是否为手机号码或电话号码示例
Dec 30 Javascript
js 模式窗口(模式对话框和非模式对话框)的使用介绍
Jul 17 Javascript
Jquery弹出层插件ThickBox的使用方法
Dec 09 Javascript
AngularJS表单编辑提交功能实例
Feb 13 Javascript
基于JavaScript实现图片点击弹出窗口而不是保存
Feb 06 Javascript
判断JS对象是否拥有某属性的方法推荐
May 12 Javascript
Layui数据表格之获取表格中所有的数据方法
Aug 20 Javascript
解决vue v-for 遍历循环时key值报错的问题
Sep 06 Javascript
javascript实现画板功能
Apr 12 Javascript
说说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队列用法实例
2014/11/05 PHP
微信自定义菜单的创建/查询/取消php示例代码
2016/08/05 PHP
yii2-GridView在开发中常用的功能及技巧总结
2017/01/07 PHP
Alliance vs AM BO3 第二场2.13
2021/03/10 DOTA
js判断当前浏览器类型,判断IE浏览器方法
2014/06/02 Javascript
jQuery中[attribute!=value]选择器用法实例
2014/12/31 Javascript
jquery仿QQ登录账号选择下拉框效果
2016/03/22 Javascript
JS与Ajax Get和Post在使用上的区别实例详解
2016/06/08 Javascript
基于JS实现移动端左滑删除功能
2017/07/28 Javascript
JavaScript自执行函数和jQuery扩展方法详解
2017/10/27 jQuery
基于js 字符串indexof与search方法的区别(详解)
2017/12/04 Javascript
vue中将html字符串转换成html后遇到的问题小结
2018/12/10 Javascript
layer.msg()去掉默认时间,实现手动关闭的方法
2019/09/12 Javascript
微信小程序canvas截取任意形状的实现代码
2020/01/13 Javascript
python使用7z解压软件备份文件脚本分享
2014/02/21 Python
Python写的Tkinter程序屏幕居中方法
2015/03/10 Python
python简单商城购物车实例代码
2018/03/15 Python
Python Learning 列表的更多操作及示例代码
2018/08/22 Python
django页面跳转问题及注意事项
2019/07/18 Python
Python3 文章标题关键字提取的例子
2019/08/26 Python
python 使用pdfminer3k 读取PDF文档的例子
2019/08/27 Python
基于keras输出中间层结果的2种实现方式
2020/01/24 Python
python实现吃苹果小游戏
2020/03/21 Python
Python中格式化字符串的四种实现
2020/05/26 Python
CSS3五个技巧给你的网站带来出色的效果
2009/04/02 HTML / CSS
HTML5本地存储之Web Storage应用介绍
2013/01/06 HTML / CSS
Adobe Html5 Extension开发初体验图文教程
2017/11/14 HTML / CSS
html5的pushstate以及监听浏览器返回事件的实现
2020/08/11 HTML / CSS
美国五金商店:Ace Hardware
2018/03/27 全球购物
大学生新闻专业个人自我评价
2013/11/12 职场文书
美术师范毕业生自荐信
2013/11/16 职场文书
酒店司机岗位职责
2013/12/14 职场文书
组工干部对照检查材料
2014/08/25 职场文书
高三英语教学计划
2015/01/23 职场文书
2015年环境整治工作总结
2015/05/22 职场文书
python opencv通过按键采集图片源码
2021/05/20 Python