Вызов функции без скобок

Сегодня мне сказали, что можно вызывать функцию без скобок. Единственное, о чем я мог думать, это использовать такие функции, как applyили call.

f.apply(this);
f.call(this);

Но они требуют скобок applyи callоставляют нас на первом месте. Я также рассмотрел идею передачи функции некоторому обработчику событий, например setTimeout:

setTimeout(f, 500);

Но тогда возникает вопрос "как вы вызываете setTimeoutбез скобок?"

Так в чем же решение этой загадки? Как вы можете вызвать функцию в Javascript без использования скобок?

Есть несколько разных способов вызова функции без скобок.

Давайте предположим, что вы определили эту функцию:

function greet() {
    console.log('hello');
}

Далее следуйте нескольким способам звонка greetбез скобок:

1. Как конструктор

С помощью newвы можете вызвать функцию без скобок:

new greet; // parentheses are optional in this construct.

Из МДН на newоператора :

Синтаксис

new constructor[([arguments])]

2. Как toStringили valueOfРеализация

toStringи valueOfявляются специальными методами: они вызываются неявно, когда необходимо преобразование:

var obj = {
    toString: function() {
         return 'hello';
    }
}

'' + obj; // concatenation forces cast to string and call to toString.

Вы можете (ab) использовать этот шаблон для вызова greetбез скобок:

'' + { toString: greet };

Или с valueOf:

+{ valueOf: greet };

valueOfи toStringфактически вызываются из метода @@ toPrimitive (начиная с ES6), и поэтому вы также можете реализовать этот метод:

+{ [Symbol.toPrimitive]: greet }
"" + { [Symbol.toPrimitive]: greet }

2.b Переопределение valueOfв прототипе функции

Вы можете использовать предыдущую идею, чтобы переопределить valueOfметод в Functionпрототипе :

Function.prototype.valueOf = function() {
    this.call(this);
    // Optional improvement: avoid `NaN` issues when used in expressions.
    return 0; 
};

Как только вы это сделали, вы можете написать:

+greet;

И хотя в этой строке присутствуют круглые скобки, фактический вызывающий вызов не имеет круглых скобок. Подробнее об этом читайте в блоге «Вызов методов в JavaScript, без их реального вызова»

3. Как генератор

Вы можете определить функцию генератора (с *), которая возвращает итератор . Вы можете вызвать это, используя синтаксис распространения или с for...ofсинтаксисом.

Сначала нам нужен генераторный вариант исходной greetфункции:

function* greet_gen() {
    console.log('hello');
}

И затем мы вызываем его без скобок, определяя метод @@ iterator :

[...{ [Symbol.iterator]: greet_gen }];

Обычно у генераторов где-то есть yieldключевое слово, но оно не требуется для вызова функции.

Последний оператор вызывает функцию, но это также можно сделать с помощью деструктуризации :

[,] = { [Symbol.iterator]: greet_gen };

или for ... ofконструкция, но она имеет свои собственные круглые скобки:

for ({} of { [Symbol.iterator]: greet_gen });

Обратите внимание, что вы можете сделать то же самое с исходной greetфункцией, но это вызовет исключение в процессе после того , какgreet он был выполнен (протестирован на FF и Chrome). Вы можете управлять исключением с помощью try...catchблока.

4. Как добытчик

У @ jehna1 есть полный ответ на этот вопрос, так что отдайте ему должное. Вот способ вызвать функцию без скобок в глобальной области видимости, избегая устаревшего__defineGetter__ метода. Он использует Object.definePropertyвместо этого.

Для этого нам нужно создать вариант исходной greetфункции:

Object.defineProperty(window, 'greet_get', { get: greet });

А потом:

greet_get;

Замените windowна то, чем является ваш глобальный объект.

Вы можете вызвать исходную greetфункцию, не оставляя следа на глобальном объекте, например так:

Object.defineProperty({}, 'greet', { get: greet }).greet;

Но можно утверждать, что у нас есть круглые скобки (хотя они не участвуют в фактическом вызове).

5. Как функция тега

Начиная с ES6, вы можете вызывать функцию, передавая ей литерал шаблона с этим синтаксисом:

greet``;

Смотрите «Помеченные литералами шаблона» .

6. Как обработчик прокси

Начиная с ES6, вы можете определить прокси :

var proxy = new Proxy({}, { get: greet } );

И тогда чтение любого значения свойства вызовет greet:

proxy._; // even if property not defined, it still triggers greet

Есть много вариантов этого. Еще один пример:

var proxy = new Proxy({}, { has: greet } );

1 in proxy; // triggers greet

7. Как экземпляр проверки

instanceofОператор выполняет @@hasInstanceметод на второй операнд, когда определяется:

1 instanceof { [Symbol.hasInstance]: greet } // triggers greet

Самый простой способ сделать это с newоператором:

function f() {
  alert('hello');
}

new f;

Хотя это неортодоксально и неестественно, это работает и совершенно законно.

newОператор не требует скобок , если не используется никаких параметров.

Вы можете использовать геттеры и сеттеры.

var h = {
  get ello () {
    alert("World");
  }
}

Запустите этот скрипт только с:

h.ello  // Fires up alert "world"

Редактировать:

Мы можем даже сделать аргументы!

var h = {
  set ello (what) {
    alert("Hello " + what);
  }
}

h.ello = "world" // Fires up alert "Hello world"

Изменить 2:

Вы также можете определить глобальные функции, которые можно запускать без скобок:

window.__defineGetter__("hello", function() { alert("world"); });
hello;  // Fires up alert "world"

И с аргументами:

window.__defineSetter__("hello", function(what) { alert("Hello " + what); });
hello = "world";  // Fires up alert "Hello world"

Отказ от ответственности:

Как сказал @MonkeyZeus: Никогда не используйте этот кусок кода в производстве, независимо от того, насколько хороши ваши намерения.

Вот пример для конкретной ситуации:

window.onload = funcRef;

Хотя это утверждение на самом деле не вызывает, но приведет к будущему вызову .

Но я полагаю, что серые области могут подойти для загадок, подобных этой :)

Если мы примем подход латерального мышления, в браузере есть несколько API, которые мы можем использовать для выполнения произвольного JavaScript, включая вызов функции, без каких-либо символов в скобках.

1. locationи javascript:протокол:

Одним из таких методов является злоупотребление javascript:протоколом о locationназначении.

Рабочий пример:

location='javascript:alert\x281\x29'

Хотя технически \x28 и \x29все еще являются круглыми скобками после оценки кода, фактический (и )символ не отображаются. Скобки экранируются в строке JavaScript, которая оценивается при назначении.

2. onerrorи eval:

Точно так же, в зависимости от браузера мы можем злоупотреблять глобальным onerror, устанавливая его evalи выбрасывая что-то, что приведёт к правильному JavaScript. Это хитрее, потому что браузеры не согласуются с таким поведением, но вот пример для Chrome.

Рабочий пример для Chrome (не Firefox, другие не тестировались):

window.onerror=eval;Uncaught=0;throw';alert\x281\x29';

Это работает в Chrome, потому throw'test'что передается 'Uncaught test'в качестве первого аргумента onerror, который является почти допустимым JavaScript. Если мы вместо этого сделаем throw';test'это пройдет 'Uncaught ;test'. Теперь у нас есть действующий JavaScript! Просто определите Uncaughtи замените тест на полезную нагрузку.

В заключение:

Такой код действительно ужасен и никогда не должен использоваться , но иногда используется в атаках XSS, поэтому мораль этой истории заключается в том, чтобы не использовать скобки для предотвращения XSS. Использование CSP для предотвращения такого кода также будет хорошей идеей.

В ES6 у вас есть то, что называется тегами литералов шаблонов .

Например:

function foo(val) {
    console.log(val);
}

foo`Tagged Template Literals`;