JSFiddle - React, Tailwind, and code Playground

JavaScript

var list = [
    {"id": 1, "parentId": null, "text": "Первая строка"}, 
    {"id": 2, "parentId": 3,    "text": "Вторая строка"}, 
    {"id": 3, "parentId": 1,    "text": "Третья строка"},
    {"id": 4, "parentId": 1,    "text": "Четвёртая строка"},
    {"id": 5, "parentId": null, "text": "Пятая строка"}, 
    {"id": 6, "parentId": 5,    "text": "Шестая строка"}, 
    {"id": 7, "parentId": 6,    "text": "Седьмая строка"}, 
    {"id": 8, "parentId": 5,    "text": "Восьмая строка"}
];

/*
 * 1 -> 3 -> 2
 *  \
 *   -> 4
 *
 * 5 -> 6 -> 7
 *  \
 *   -> 8
 */

var stack = list
	.filter(node => node.parentId === null)
  .map(node => [0, node]);

while (stack.length) {
  // Chrome 49+, Firefox 34+
	// var [depth, current] = stack.shift();
  var _tmp = stack.shift(), depth = _tmp[0], current = _tmp[1];

  visit(depth, current);

  childrenOfCurrent = list
  	.filter(node => node.parentId === current.id)
    .map(child => [depth + 1, child]);

  stack = childrenOfCurrent.concat(stack);
}

function visit(depth, node) {
  console.log('-'.repeat(depth) + current.id);
}