angular.extend
и jQuery.extend
очень подобны. Они оба делают мелкий копия свойства от одного или нескольких исходных объектов до целевого объекта. Так, например:
var src = {foo: "bar", baz: {}};
var dst = {};
whatever.extend(dst, src);
console.log(dst.foo); // "bar"
console.log(dst.baz === src.baz); // "true", it's a shallow copy, both
// point to same object
angular.copy
обеспечивает глубокий копия:
var src = {foo: "bar", baz: {}};
var dst = angular.copy(src);
console.log(dst.baz === src.baz); // "false", it's a deep copy, they point
// to different objects.
Возвращение к extend
: Я только вижу одну значительную разницу, которая является, что jQuery extend
позволяет Вам указывать всего, что один объект, в этом случае jQuery
сам является целью.
Общие черты:
Это - мелкая копия. Таким образом, если src
будет иметь свойство p
, которое относится к объекту, [то 1111] получит свойство p
, которое относится к тот же объект (не копия объекта).
они оба возвращают целевой объект.
они оба поддержка несколько исходных объектов.
они оба делают несколько исходных объектов в порядке , и таким образом, последний исходный объект "победит" в случае, если больше чем один исходный объект имеет то же имя свойства.
страница Test: Живая Копия | Живой Источник
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
<meta charset=utf-8 />
<title>Extend!</title>
</head>
<body>
<script>
(function() {
"use strict";
var src1, src2, dst, rv;
src1 = {
a: "I'm a in src1",
b: {name: "I'm the name property in b"},
c: "I'm c in src1"
};
src2 = {
c: "I'm c in src2"
};
// Shallow copy test
dst = {};
angular.extend(dst, src1);
display("angular shallow copy? " + (dst.b === src1.b));
dst = {};
jQuery.extend(dst, src1);
display("jQuery shallow copy? " + (dst.b === src1.b));
$("<hr>").appendTo(document.body);
// Return value test
dst = {};
rv = angular.extend(dst, src1);
display("angular returns dst? " + (rv === dst));
dst = {};
rv = jQuery.extend(dst, src1);
display("jQuery returns dst? " + (rv === dst));
$("<hr>").appendTo(document.body);
// Multiple source test
dst = {};
rv = angular.extend(dst, src1, src2);
display("angular does multiple in order? " +
(dst.c === src2.c));
dst = {};
rv = jQuery.extend(dst, src1, src2);
display("jQuery does multiple in order? " +
(dst.c === src2.c));
function display(msg) {
$("<p>").html(String(msg)).appendTo(document.body);
}
})();
</script>
</body>
</html>
Существует одно тонкое различие между двумя, которое не было упомянуто в предыдущих ответах.
.extend jQuery () позволяет, Вы к условно добавляете ключ, оцениваете пар, только если значение определяется . Таким образом в jQuery, этом: $.extend({}, {'a': x ? x : undefined});
возвратится {}
в случае, если x
не определено.
В .extend Angular () однако, это: angular.extend({}, {'a': x ? x : undefined});
возвратится {'a': undefined}
, даже если x
будет не определено. Таким образом, ключ будет там, несмотря ни на что.
Это могло быть пользой или плохой вещью, в зависимости от того, в чем Вы нуждаетесь. Так или иначе вот в чем разница в [1 111] поведение между этими двумя библиотеками.
1.0.7 сборки angularjs указывают что расширение & методы копии больше не копируют по angularjs внутренним значениям $$hashKey.
См. информацию о версии https://github.com/angular/angular.js/blob/master/CHANGELOG.md
angular.copy/angular.extend: не копируйте $$hashKey в копии/функциях расширения. (6d0b325f, № 1875)
А быстрый тест angular.copy в методе инструментов Chomre dev показывает, что действительно делает глубокую копию.
x = {p: 3, y: {x: 5}}
Object {p: 3, y: Object}
x
Object {p: 3, y: Object}
z = angular.copy(x);
Object {p: 3, y: Object}
z
Object {p: 3, y: Object}
x
Object {p: 3, y: Object}
z.y.x = 1000
1000
x
Object {p: 3, y: Object}
p: 3
y: Object
x: 5
__proto__: Object
__proto__: Object
z
Object {p: 3, y: Object}
p: 3
y: Object
x: 1000
__proto__: Object
__proto__: Object
angular.extend, с другой стороны, делает мелкую копию.
. расширитесь () в работах AngularJS так же к .extend jQuery ()
http://jsfiddle.net/Troop4Christ/sR3Nj/
var o1 = {
a: 1,
b: 2,
c: {
d:3,
e:4
}
},
o2 = {
b: {
f:{
g:5
}
}
};
console.log(angular.extend({}, o1, o2));
console.log(o1);
console.log(o2);