JS中怎么将多个对象添加到一个对象中？

Posted 2023-03-16

为了组合 JSON

这个只能用集合来实现。
在javascript中，常用Array来存储和操作对象:

Array:
新建:var ary = new Array(); 或 var ary = [];
增加:ary.push(value);
删除:delete ary[n];
遍历:for ( var i=0 ; i < ary.length ; ++i ) ary[i]; 参考技术A // 合并对象
function extend(target, source) for (var obj in source)
target[obj] = source[obj];
return target;
// 测试
var a = a: 1, b: 2; var b = a: 2, b: 3, c: 4; var c = extend(a, b); console.log(c); 参考技术B

方法一：（最简单也是最笨的方法）
window.a = function()window.b = function()window.c = function()

方法二：（利用jq的extend方法）

window.c = function()$.extend(window,a:function(),b:function(),c:function(),)

方法三：（利用js）

(() => var defining = a: function() ,b: function(,c:function(;Object.keys(defining).forEach(key => window[key] = defining[key];);)((); 

方法四：（window 下的对象是变量的时候）
window[变量]=function()

参考技术C JS中将多个对象添加到一个对象中，方法如下：

方法一：
// 合并对象
function extend(target, source) for (var obj in source)
target[obj] = source[obj];
return target;
// 测试
var a = a: 1, b: 2; var b = a: 2, b: 3, c: 4; var c = extend(a, b); console.log(c);
方法二：
通过JQuery的each方法遍历添加，将事件绑定在所有被遍历的对象上：
$("div").each(function() $(this).click(function()alert('test');); );
each方法描述：以每一个匹配的元素作为上下文来执行一个函数。
方法三：
当然除了以上两种方法也可以使用原始的循环方法进行多对象绑定，创建一个对象数组然后循环添加，原理其实和方法一差不多：
var array = [a,b,c];
for(var i=0;i<array.length;i++) array[i].bind("event",function(e,data) alert("bind success");)); 参考技术D 比如有三个对象：var obj1 = ;var obj2=;var obj3=;
把obj2和obj3添加到obj1中：
obj1.filed1=obj2;
obj1.filed2=obj3;追问

这个如果我要循环添加的话，filed这个要怎么改？
这个可以写成 obj1.filed[i] 或者obj1.filed+i 吗？

本回答被提问者采纳

将三个.js复合对象添加到A-Frame中，导致子对象意外闪烁

我正在为我最初使用threejs创建的网络应用添加增强现实体验

我有一个复合对象（这是一个具有多个网格的Object3D实例）。但是将它放入A-Frame会产生意外的闪烁，如下图所示

带有threejs的原始web应用程序的 Pic在下面给出了我有三个.js代码，如下所示

scene = new THREE.Scene();
mainObj = new THREE.Object3D();
scene.add(mainObj);
renderer = new THREE.WebGLRenderer({alpha: true, antialias: true});
renderer.sortObjects = false
container = document.getElementById("canvas-container");
width = $(container).innerWidth();
height = $(container).innerHeight();
renderer.setSize(width, height);
container.appendChild(renderer.domElement);
camera = new THREE.PerspectiveCamera(75, width / height, 10, 2000);
camera.position.set(0, 67, 100);
controls = new THREE.OrbitControls( camera , container);
controls.dampingFactor = 0.2;
controls.enableDamping = true;
controls.target.set( 0, 10, -20 );
controls.maxPolarAngle = (Math.PI/2) - 0.05;
controls.maxDistance = 800;
controls.minDistance = 2;
controls.target.set(0, buildingConfig.h/2, buildingConfig.l/-2)
controls.enableKeys = false;
controls.update();
scene.add(camera);
light = new THREE.HemisphereLight(0xffffff, 0xffffff, 0.7);
light.position.set(1, 10000, 1);
light.castShadow = true
scene.add( light );
renderer.render(scene, camera);
// logic to add child meshes to mainObj

我改为将其包含在A-Frame中。

<script type="text/javascript">
  initmodels();
  AFRAME.registerComponent('e1', {
    init:function(){
      this.el.setObject3D('building', mainObj);
    }
  });
</script>

<a-scene e1>

</a-scene>

我想这个问题与场景或渲染器有关。任何人都可以帮助我在A-Frame中设置适当的场景或渲染器

答案

这看起来像z战斗。 three.js版本是否在与您的aframe版本不同的系统上运行？

不同的平台具有不同的z缓冲区精度。可能需要您更改几何图形以补偿有限的分辨率。

此外，我不知道AR.s，但三个渲染器有一个“logarithmicDepthBuffer”选项，可以提高你的z缓冲区的分辨率，但可能有一些副作用。

另一答案

我有完全相同的问题。经过一些试验和错误后，我能够解决它

1. 添加了最近版本的aframe
2. 添加<a-scene embedded artoolkit='sourceType: webcam;' renderer='logarithmicDepthBuffer: true;'>
3. 添加<a-marker-camera camera="far:100000; near:0.01" >
4. 主要原因是灯光，取下所有灯光，只将半球灯光添加到场景中，然后在其他灯光下即兴发挥。

希望这也能解决你的问题。