angular 中一些常用的小方法之详解API

angular ag-grid api 阅读详情

使用angular进行开发,其中有一些好用的小方法,在这里进行梳理一下。

常用小方法:

  1. angular.merge 用于深拷贝对象,官方的一句话:

    Deeply extends the destination object dst by copying own enumerable properties from the src object(s) to dst. You can specify multiple src objects. If you want to preserve original objects, you can do so by passing an empty object as the target: var object = angular.merge({}, object1, object2).

    Unlike extend(), merge() recursively descends into object properties of source objects, performing a deep copy.

    从src对象中拷贝可枚举的属性到目标对象dst中,用于深度扩展目标对象. 你可以指定多个src对象,如果想要保存原对象,那么传递一个空对象作为目标对象 如: angular.erge({},object1,object2);

    不像extend函数,merge 对原对象的属性进行递归,执行一次深拷贝

    • 举例说明问题:

      // merge 
      var obj1 = {"name":"obj1name","age":25};
      var obj2 = {"name":"obj2name","weight":75};
      
      var res = angular.merge(obj1,obj2);
      console.log('obj1');
      console.log(obj1);
      
      console.log('obj2');
      console.log(obj2);
      
      console.log('res');
      console.log(res); 
      
      /* 上面输出内容为:
          obj1
          Object {name: "obj2name", age: 25, weight: 75}
          obj2
          Object {name: "obj2name", weight: 75}
          res
          Object {name: "obj2name", age: 25, weight: 75}
          由上可见 merge 改变了目标对象的值
      */
      

      此方法用于对象的深拷贝,拷贝自己可枚举的属性,如果存在则替换,不存在追加。

          var obj3 = {"name":"obj3name","color":"red"};
          var obj4 = {"name":"obj4name","size":43};
      
          var res = angular.merge({},obj3,obj4); // 此处添加一个空对象
      
          console.log('obj3');
          console.log(obj3);
      
          console.log('obj4');
          console.log(obj4);
      
          console.log('res');
          console.log(res); 
      
          /* 上面输出内容为:
              obj3
              Object {name: "obj3name", color: "red"}
              obj4
              Object {name: "obj4name", size: 43}
              res
              Object {name: "obj4name", color: "red", size: 43}
              由此可见,添加了一个空对象,阻止了对原对象的更改。
          */
  2. angular.extend

    引用官方的一句话:

    Extends the destination object dst by copying own enumerable properties from the src object(s) to dst. You can specify multiple src objects. If you want to preserve original objects, you can do so by passing an empty object as the target: var object = angular.extend({}, object1, object2).

    Note: Keep in mind that angular.extend does not support recursive merge (deep copy). Use angular.merge for this.

    从src对象中拷贝自己的可枚举属性到dst,用来扩展目标对象dst。可指定多个src 对象。 如果想要保存原对象,可以传一个空对象作为目标, 如: var object = angular.extend({},object1,object2);

    注意: extend 方法不支持递归式深拷贝,如果需要,请使用 angular.merge

    直接上代码:

    var a = {"group":1,"dept":"computerTech"};
    var b = {"group":2,"age":30};
    
    var res = angular.extend(b,a);
    console.log(a); // Object {group: 1, dept: "computerTech"}
    console.log(b); // Object {group: 1, age: 30, dept: "computerTech"}
    console.log(res); // Object {group: 1, age: 30, dept: "computerTech"}
    // 右上可见 extend 改造了目标对象

    同样可以通过一个空对象参数,不让其改变原始对象的值

  3. angular.copy

    引用官方语言:

    Creates a deep copy of source, which should be an object or an array.(创造source的深拷贝,其中source应该时对象或者数组)

    If no destination is supplied, a copy of the object or array is created.(如果没有destination,那么这个对象或数组的拷贝被创建)

    If a destination is provided, all of its elements (for arrays) or properties (for objects) are deleted and then all elements/properties from the source are copied to it.(如果提供了destination,针对数组,所有的元素,针对对象,所有的属性都会被删除,然后从source里拷贝所有的元素或者属性进来)

    If source is not an object or array (inc. null and undefined), source is returned.(如果source不是一个对象或数组,比如null或者undefined,那么会返回source,备注:这个需要自己写写测试代码,就知道了)

    If source is identical to destination an exception will be thrown.(如果source和destination是一个对象,那么会抛出异常)

    • 未完 …
angular精品API angular专业指导文件(api文件),前端框架不二之选,欢迎下载! 立即下载

相关推荐

AngularJS API常用方法示例

AngularJS API常用方法示例 如有疑问,请在 http://blog.youkuaiyun.com/wzf420039341/article/details/50771053 留言。

angular自带的一些api_Angular2.0正式版api使用漫谈

ng2综述ng2的rc版本和今年9月中旬发布的2.0.0正式版本,在核心思想上面是有些变动的。为了降低原来使用angular1的开发者切换到angular2的成本。谷歌angular2团队在架构angular2的过程中,在权衡纯components组件化开发还是ngModule system之间的比重上面做了不少妥协。个人的项目开发体会确实,我在写ng2-tutorial的过程中,内心还是有些感慨...

weixin_39554172的博客 278

Angular+WebAPI入门示例

使用Angular+WebAPI,编写的一个入门示例,主要用于学习Angular,包括了路由的配置、Http等配置

angular.merge(合并)

angular.module('test',[]).controller('con',function ($scope) { $scope.json1 = { a:12, b:'fjks', c:[1,2,3,4], d:{ 1:'a', 2:'b', 3:'c' ...

weixin_30376323的博客 500

MarkDown简介(深度解析MarkDown用法)

欢迎使用Markdown编辑器写博客 本Markdown编辑器使用StackEdit修改而来,用它写博客,将会带来全新的体验哦: Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接和图片上传 LaTex数学公式 UML序列图和流程图 离线写博客 导入导出Markdown文件 丰富的快捷键 快捷键 加粗 Ctrl + B 斜体 Ctrl + I...

酷酷的旭 7344

Unity面试题总结

Unity面试题

sinat_34014668的博客 1万+

angular调用接口方式_angularjs调用api接口

[Angularjs]视图和路由(三)写在前面上篇文章主要介绍了路由中when方法的第二个参数,常见的几个属性,以及作用。本篇文章,将介绍和路由相关的几个常见的服务。系列文章[Angularjs]ng-select和ng-options[Angularjs]ng-show和ng-hide[Angularjs]视图和路由(一)...文章ghost丶桃子2016-05-241557浏览量Angular...

weixin_39765840的博客 3469

避开这些坑!SOEM控制伺服电机时PDO配置与状态机处理的常见误区

本文深入探讨了使用SOEM控制伺服电机时PDO配置与状态机处理的常见误区,提供了详细的避坑指南。从SyncManager配置顺序到状态字位掩码应用,再到网络同步优化,帮助开发者避免通信失败和系统不稳定问题,提升工业自动化项目的可靠性。

chongtai6075的博客 484

angular.extend方法和merge方法

AngularJs的angular.extend()方法可以把一个或多个对象中的方法和属性扩展到一个目的对象中,使得这个对象拥有其他对象相同的方法和属性,如下图所示。 angular.extends()方法的第一个参数是要被扩展的对象,后面可以传入一个或多个对象。 如果想要保存一个对象的状态,除了可以调用angular.copy()方法外,还可以把一个空对象{}作为第一个对象传入。

David.G的博客 1128

【WebLogic】Linux图形化界面安装WebLogic 14.1.2.0

Linux系统图形化界面安装WebLogic 14.1.2.0.0版本

cnskylee的博客 840

从零到一:构建嵌入式Nginx的模块化架构与跨平台部署实战

本文详细介绍了在ARM32架构的RV1126嵌入式设备上,通过交叉编译技术构建模块化Nginx服务器的完整实战流程。涵盖环境配置、依赖库编译、Nginx核心与http_ssl_module等模块集成、性能优化及部署调试,为嵌入式开发提供高效可靠的Web服务器解决方案。

rock5的博客 203

angularJs中的copy,extend,merge(深拷贝和浅拷贝)

平时做项目应该经常用了拷贝数据,之前文章有详细讲解过深拷贝和浅拷贝的问题,那么在angular的环境中有那么拷贝呢,平时我们用的比较多的会是copy,extend,merge,下面详细讲解下其中的用法和坑! 1 .angular.copy(source,destination) 先搬出官方定义的API: 复制一个对象或者一个数组(好吧,万物皆对象,数组也是一个对象)。 如果省略了destination,一个新的对象或数组将会被创建出来。 如果提供了destination,则source对象中的所有元素和属

1473

计算机模拟爆破过程,基于LSDYNA岩石爆破模拟建模分析

原标题:基于LSDYNA岩石爆破模拟建模分析 Ls Dyna岩石爆破模拟仿真作者:dyna_focus擅长领域:dyna/abaqus/hypermesh一、 数值模型的建立1.1 单元及算法的选择岩石,炸药,空气都采用solid164实体单元。岩石采用常应力实体单元,该种单元属于纯粹的lagrange算法,该种算法单元网格附着在材料上,随着材料的流动而产生单元网格的变形,但是在结构变形巨大时,有...

weixin_29494379的博客 7317

Animate.scss与现代前端框架集成:React/Vue/Angular使用教程

Animate.scss是一款基于Dan Eden's Animate.css的Sass mixins库,提供了丰富的CSS动画效果,可以轻松地与React、Vue和Angular等现代前端框架集成,为你的Web应用增添生动的交互体验。 ## 什么是Animate.scss? Animate.scss是Animate.css的Sass版本实现,通过Sass mixins的方式提供了60多种预定

gitblog_00327的博客 393

点云最小二乘法拟合曲线

文章目录一、引言 一、引言

dayuhaitang1的博客 2736

① Django手把手从零开发个人博客-前言

手把手教你从零开始玩转手把手教你从零开始玩转Django,全面学习并了解django的运行机制、开发全流程及线上部署。Django,全面学习并了解django的运行机制、开发全流程及线上部署。 专栏介绍 本套教程遵循Django的设计思想,开门见山,快速切入主题,拒绝拖沓,在实战中学习每一个知识点,提高学习的趣味性以及个人成就感,并且能快速将所学运用到实际项目中。 将从零手把手带着你一步步完成博客的每一个功能,通过实现博客文章列表页、文章详情页、作者页面等功能来学习和了解django的视图查询模块相关知.

轻编程的博客 515

angular-spinner API完全参考:指令、服务与配置选项详解

angular-spinner是一个基于Spin.js的Angular指令,用于在应用中显示动画加载指示器。本文将全面解析其API组成,包括核心指令、服务方法和配置选项,帮助开发者快速掌握这个强大工具的使用技巧。 ## 核心指令:usSpinner ### 基础用法 usSpinner是angular-spinner的核心指令,通过在HTML元素上添加`us-spinner`属性即可启用加载

gitblog_00152的博客 686

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

angular自带的一些api_Angular API

js框架 APIAPI stands for ApplicationProgramming Interface.AngularJS Global APIThe AngularJS Global API is a set of global JavaScript functions forperforming common taskslike:Comparing objectsIterating o...

weixin_39595271的博客 176

IDEA的使用指南

IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

Angular 内存 Web API 实战:用 angular-in-memory-web-api 模拟 REST 服务,为 Demo 与测试提速

本指南聚焦 Angular 官方仓库中的 `angular-in-memory-web-api` 包:它在不启动任何真实后端的情况下,把 `HttpClient` 的请求拦截并转交给一个由你控制的"内存数据库",从而完整模拟一套 RESTy CRUD 接口。读完本文,你将掌握从零搭建 `InMemoryDbService`、注册模块、调优配置参数,到利用命令、自定义解析器、HTTP 方法拦截器与响

gitblog_00306的博客 827

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

angular蚂蚁_angular api文档

AngularJS 中的友好 URL —— 移除URL 中的 # 【已翻译100%】AngularJS 默认将会使用一个 # 号来对URL进行路由.例如:http://example.com/http://example.com/#/abouthttp://example.com/#/contact要获得干净的URL并将井号从URL中移除是很容易的.完成两件事情就...文章青衫无名2017-06-...

weixin_40005542的博客 1029

angular蚂蚁_angular4 调用api

angular2 问题请教angular2 通过http服务进行对后端api的远程调用?我简单的尝试了一下,发现了几个问题,记录一下,以方便查找问题。angular2 http服务的跨域问题?跨域本身就是一个很复杂的问题,angular2对跨域的处理。angular2 如果在providers中加入http服务会出...文章架构师郭郭2016-11-29670浏览量Angular5.1以及更多可用...

weixin_39737233的博客 884

angular自带的一些api_AngularJS API

Angular封装了一系列公共方法,帮助我们更简单的使用 JS。1、angular.bind()angular.bind 类似于 Function.prototype.bind,实现函数柯里化,返回一个函数代理。eg://函数原型angular.bind(/*this对象*/self, /*要封装的function*/fn, /*参数列表*/args);//原始函数function fun(arg...

weixin_39968128的博客 294

angular-websocket API详解:掌握$websocket服务的所有方法与属性

angular-websocket是一个专为Angular应用设计的WebSocket服务,通过$websocket服务可以轻松实现实时双向通信。本文将详细介绍$websocket服务的核心方法、属性及使用技巧,帮助开发者快速掌握实时通信功能的实现。 ## 快速入门:创建WebSocket连接 使用$websocket服务的第一步是建立连接。只需传入WebSocket服务器URL,即可创建一个

gitblog_00485的博客 647

angular-oauth2-oidc独立API使用教程:Angular 14+新特性详解

angular-oauth2-oidc是一个专为Angular应用设计的OAuth2和OpenID Connect(OIDC)认证库,从Angular 14版本开始引入了独立API(Standalone API),让开发者可以更灵活地在独立组件架构中集成认证功能。本文将详细介绍这一全新特性的使用方法和优势。 ## 🌟 独立API:Angular 14+的革新性变化 Angular 14引入的

gitblog_00333的博客 299

angular自带的一些api_10、angular的全部api

1、lowercasevarapp=angular.module('myApp',[]);app.controller('myCtrl',function($scope){console.log(angular.lowercase('AbCdEf'))});2、uppercasevarapp=angular.module('myApp',[]);app.controller('...

weixin_39693295的博客 249

C# 的API建立 以及Angular 的Http传参

做一个小项目需要C# 做后台,ionic 做前端,Ionic 里面用Angular 的框架 现在介绍Angular 的Http 传参,和C# Api的建立。。。 Angular 因为POST方法还没有研究,所以没写。下面只写Get传参 要进行Http 请求,就必须先在app.module.ts中加上HttpClientModule加上HttpClientModule后。 在用到http请求...

爱小雨的豆豆大神 562
上一篇: 从内存角度分析:数组删除自己内部指定对象和通过函数形参改值问题
下一篇: 在git中出现中文乱码的解决方案
Wang's Blog
博客等级 码龄12年 7433粉丝 2421原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Wang's Blog

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值