Как геттеры в Vue получает список своих зависимостей?

Я не использую vue, так что могу ошибаться. Но предполагаю, что оно в любом случае высчитывает все поля. Имелось ввиду, что dom не меняется, если не изменилось computed, которое меняется когда меняется this.message.split. То есть никаких регулярок там нет, поле computed всегда считается.

Что-то оно и вовсе не вычисляется

app = new Vue({
    el: "#report-app",
    data: {
        a: 1,
        b: 2,
    },
    computed: {
        c: function() {
            console.log('computing');
            return this.b + 1;
        }
    }
})

// В консоли
app.a = 5
app.b = 5
app.c
"computing"

При этом DOM обновляется при изменении this.b:

<div> b = {{b}}, c = {{c}} </div>

... Подскажите, при помощи какой такой черной магии, Vue для каждого геттера получает список свойств, от которых этот геттер зависит? Неужто парсит тело функции регулярками?

https://v1.vuejs.org/guide/reactivity.html

Там написано «It should be noted that Vue.js computed properties are not simple getters. Each computed property keeps track of its own reactive dependencies. When a computed property is evaluated, Vue.js updates its dependency list and caches the result value»

А как именно компьютед проперти узнает от каких именно реактивных свойств компонента оно зависит - не написано. И что-то я не припомню в js механизма, позволяющего получить список переменных из тела функции кроме как парсинг этого тела

А как именно компьютед проперти узнает от каких именно реактивных свойств компонента оно зависит - не написано.

Я исходники не смотрел - могу только высказать свои предположения. К примеру, можно отследить обращения ко всем реактивным свойствам во время вычисления конкретного значения «computed property» - это и будут текущие зависимости вычисленного и закэшированного значения этого самого «computed property».

... кстати, при вычислении зависимостей учитываются именно и только реактивные свойства.

... ну и следует подчеркнуть, что такие зависимости - это, скорее всего, не что-то постоянное. По логике, они должны быть привязаны к конкретному вычисленному значению и могут поменяться при следующем вычислении свойства.

Еще важный момент - это то, что «computed property» не всегда можно использовать. В вашей изначальной ссылочке на документацию приведен пример с «return Date.now()», где использование «computed property» - это логическая ошибка. Там, где при вычислении значения используются какие-то нативные Javascript-объекты переменчивой сущности или, к примеру, просто глобальные переменные (не реактивные) - следует использовать «Methods».

К примеру, можно отследить обращения ко всем реактивным свойствам во время вычисления конкретного значения «computed property»

О, точно. Ловко придумано. Сам бы в жизни де догадался)

Ну эт понятно. Вообще занимательное чтиво, в совокупности с vuex. Я получил удовольствие похлеще чем от художественного произведения)

Удивительно чего можно намудрить на голом es5

Очень подробно принципы и алгоритмы pull-парадигмы описаны тут: https://habr.com/post/317360/

А почему ты говоришь о this.message.split? Разве split это не вызов метода над this.message?

Не понял вопроса)

В теме написано

если изменить свойство this.message.split

Разве split это не функция, метод, а не свойство?

Аа. Имелось в виду this.message. Скопипастил больше чем надо)

Я сначала и подумал что опечатка, а потом испугался, вдруг что-то совсем базовое не понимаю в js.