EachBlock() — svelte Function Reference

Architecture documentation for the EachBlock() function in EachBlock.js from the svelte codebase.

Function javascript Compiler Migrator calls 2

Entity Profile

Compiler→ Migrator→ EachBlock() — svelte Function Reference

Dependency Diagram

graph TD
  a4de99d6_1919_5966_a448_8c33342e4e5e["EachBlock()"]
  bea5ec25_19aa_9b00_03f5_887d4879cbe4["EachBlock.js"]
  a4de99d6_1919_5966_a448_8c33342e4e5e -->|defined in| bea5ec25_19aa_9b00_03f5_887d4879cbe4
  b1e5dc64_3cf8_8970_a058_72670e0b9dfd["create_child_block()"]
  a4de99d6_1919_5966_a448_8c33342e4e5e -->|calls| b1e5dc64_3cf8_8970_a058_72670e0b9dfd
  b32db3f2_1070_0f2a_e77c_b50a79fc24a4["blockers()"]
  a4de99d6_1919_5966_a448_8c33342e4e5e -->|calls| b32db3f2_1070_0f2a_e77c_b50a79fc24a4
  style a4de99d6_1919_5966_a448_8c33342e4e5e fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/src/compiler/phases/3-transform/server/visitors/EachBlock.js lines 11–76

export function EachBlock(node, context) {
	const state = context.state;

	const each_node_meta = node.metadata;
	const collection = /** @type {Expression} */ (context.visit(node.expression));
	const index =
		each_node_meta.contains_group_binding || !node.index ? each_node_meta.index : b.id(node.index);

	const array_id = state.scope.root.unique('each_array');

	/** @type {Statement[]} */
	let statements = [b.const(array_id, b.call('$.ensure_array_like', collection))];

	/** @type {Statement[]} */
	const each = [];

	if (node.context) {
		each.push(b.let(node.context, b.member(array_id, index, true)));
	}

	if (index.name !== node.index && node.index != null) {
		each.push(b.let(node.index, index));
	}

	const new_body = /** @type {BlockStatement} */ (context.visit(node.body)).body;

	if (node.body) each.push(...new_body);

	const for_loop = b.for(
		b.declaration('let', [
			b.declarator(index, b.literal(0)),
			b.declarator('$$length', b.member(array_id, 'length'))
		]),
		b.binary('<', index, b.id('$$length')),
		b.update('++', index, false),
		b.block(each)
	);

	if (node.fallback) {
		const open = b.stmt(b.call(b.id('$$renderer.push'), block_open));

		const fallback = /** @type {BlockStatement} */ (context.visit(node.fallback));

		fallback.body.unshift(b.stmt(b.call(b.id('$$renderer.push'), block_open_else)));

		statements.push(
			b.if(
				b.binary('!==', b.member(array_id, 'length'), b.literal(0)),
				b.block([open, for_loop]),
				fallback
			)
		);
	} else {
		state.template.push(block_open);
		statements.push(for_loop);
	}

	state.template.push(
		...create_child_block(
			statements,
			node.metadata.expression.blockers(),
			node.metadata.expression.has_await
		),
		block_close
	);
}