What are the Alternatives to eval in JavaScript?
I have a little bit of code that looks just like this:
FireBug profiler claims that second longest function is eval(), taking up to nearly 6% of the run time.
What alternatives do I have? I could do the same as I am doing here on the server but that just shifts the burden higher up the chain. I can’t change the database layout since everything hooks into those 8 variables and is a massive undertaking.
10 Answers 10
is equivalent. Or, to use the built-in arguments object (to avoid having your parameter list in two places):
You are simply making an array from your function 8 arguments, removing the ones that are less than or equal to zero.
The following code is equivalent, and it will work for any arbitrary number of arguments:
One alternative to to pass an array to your function, instead of individual arguments:
Then your code would be:
If you really need to pass in separate arguments, you can access them using your arguments array, which is an object that acts like an array (though it’s not really; not all Array methods work on it) that exposes all arguments that have been passed in to your function; they do not even need to be declared in this case, but it’s good form to include a comment indicating what sorts of arguments you are expecting for users of your code:
Альтернатива eval () javascript [дубликат]
этот вопрос уже есть ответ здесь:
Я работаю в основном с javascript, Jquery, нокаутом и т. д.
то, что привлекло eval () ко мне, это
примечание: Я работаю в тех случаях, когда значение a и b изменяется динамически
в моей работе я имею дело с большим количеством динамических объектов из json, нокаутом и т. д. Так что эвал решает большинство моих проблем. Но когда я читал, я обнаружил, что есть так много проблем с eval (), таких как замедление и т. д.
Я много искал и не нашел никакой замены eval (), когда мне нужно оценить уравнение, полученное как строка в уравнение как объект.
может ли кто-нибудь предложить плагин или функцию альтернативу eval() имея в виду пример, который я привел выше
я создаю таблицу из данных Json, используя отображение нокаута. Так что когда-либо формат json является таблицей, генерируется. Я также вычисляю некоторое поле, используя вычисленный нокаут. Прямо сейчас я использую hard-coded
я хочу выполнить эти динамические уравнения. Я могу создать его dynamicaly как string, но для их оценки я проблема облицовка.
я хочу решение для
есть ли способ вычислить формулу, хранящуюся в строке в JavaScript, без использования eval?
6 ответов
если a и b переменные являются частью объекта, вы можете получить к ним доступ со строковыми индексами:
нет eval() требуются. Вы можете построить dynamicProperty строки, как вы хотите, поэтому есть практически бесконечная гибкость.
если a и b переменные являются глобалами, глобалы JS в браузере на самом деле являются детьми window объект, поэтому вы все еще можете использовать эту технику даже с глобалами.
надеюсь, это поможет.
может быть, используя window[‘var’ + num] может быть более полезным для вас. я не совсем понимаю ваш вопрос Извините.
вы имеете в виду, что хотите вычислить уравнение, которое вы не можете знать, пока не получите его?
короче:
eval можно использовать иногда, но только если строка уравнения исходит из надежного источника, и там вам нужно что-то вроде оценка динамических уравнений.
если вы можете собрать их под объект типа root =
может держать свой res переменная в актуальном состоянии, когда a или b изменения
похоже, вы пытаетесь сделать динамические уравнения, созданные пользователем.
например, это может быть «a+b+c» или «собака+кошка», и вы не знаете.
Это много работы, но есть несколько готовых решений. Например, математика.js
проверить больше альтернатив eval на этот вопрос и здесь которые оба могут считаться дубликатом.
Eval: выполнение строки кода
Встроенная функция eval позволяет выполнять строку кода.
Строка кода может быть большой, содержать переводы строк, объявления функций, переменные и т.п.
Результатом eval будет результат выполнения последней инструкции.
Код в eval выполняется в текущем лексическом окружении, поэтому ему доступны внешние переменные:
Значения внешних переменных можно изменять:
Без use strict у eval не будет отдельного лексического окружения, поэтому x и f будут видны из внешнего кода.
Использование «eval»
В современной разработке на JavaScript eval используется весьма редко. Есть даже известное выражение – «eval is evil» («eval – это зло»).
Пожалуйста, имейте в виду, что код в eval способен получать доступ к внешним переменным, и это может иметь побочные эффекты.
Использование внутри eval локальных переменных из внешнего кода считается плохим решением, так как это усложняет задачу по поддержке такого кода.
Существует два пути, как гарантированно избежать подобных проблем.
Если код внутри eval не использует внешние переменные, то вызывайте его так – window.eval(. ) :
В этом случае код выполняется в глобальной области видимости:
Если коду внутри eval нужны локальные переменные, поменяйте eval на new Function и передавайте необходимые данные как аргументы:
Конструкция new Function объясняется в главе Синтаксис «new Function». Она создаёт функцию из строки в глобальной области видимости. Так что локальные переменные для неё невидимы, но всегда можно передать их как аргументы. Получается очень аккуратный код, как в примере выше.
Итого
Вызов eval(code) выполняет строку кода и возвращает результат последней инструкции.
Задачи
Eval-калькулятор
Создайте калькулятор, который запрашивает ввод какого-нибудь арифметического выражения и возвращает результат его вычисления.
В этой задаче нет необходимости проверять полученное выражение на корректность, просто вычислить и вернуть результат.
Давайте будем использовать eval для вычисления арифметических выражений:
Каковы альтернативы eval в JavaScript?
У меня есть немного кода, который выглядит так:
Какие у меня есть альтернативы? Я мог бы сделать то же самое, что я делаю здесь на сервере, но это только увеличивает нагрузку вверх по цепочке. Я не могу изменить структуру базы данных, так как все привязывается к этим 8 переменным и является огромным мероприятием.
9 ответов
Эквивалентно. Или использовать встроенный объект arguments (чтобы ваш список параметров не располагался в двух местах):
Вы просто создаете массив из своей функции из 8 аргументов, удаляя те, которые меньше или равны нулю.
Следующий код эквивалентен, и он будет работать для любого произвольного числа аргументов:
Учитывая, что существует фиксированное количество переменных, вы можете создать их массив вручную и выполнить цикл по нему. Но если у вас есть переменное количество аргументов, один из способов получить переменные, переданные функции в виде массива:
И ваша функция будет выглядеть так:
Нет необходимости использовать eval для работы с аргументами вообще.
Альтернатива передаче массива в вашу функцию вместо отдельных аргументов:
Тогда ваш код будет:
Если вам действительно нужно передать отдельные аргументы, вы можете получить к ним доступ, используя свой << X0>> массив, который является объектом, который действует как массив (хотя на самом деле это не так; не все методы Array работают с ним), который предоставляет все аргументы, которые были переданы вашей функции; в этом случае их даже не нужно объявлять, но стоит добавить комментарий, указывающий, какого рода аргументы вы ожидаете от пользователей вашего кода:
JavaScript F.A.Q: Часть 2
1. Почему eval = evil?
1. Eval нарушает привычную логику программы, порождая код.
2. Он выполняет код в текущем контексте и может его изменять — потенциальное место для атак. Контекст можно подменить, выполнив такой трюк:
Что тут происходит: eval — это та же функция, которая зависит от способа вызова. В этом случае мы меняем контекст на глобальный.
3. Порожденный eval-ом код сложнее отлаживать.
4. Eval очень долго выполняется.
2. Чем заменить eval?
Лучшая замена eval — хорошая структура кода, которая не предполагает использование eval. Однако от eval не всегда легко отказаться (Парсинг JSON, Шаблоонизатор от Резига).
Хорошая замена eval — конструктор Function. Но это тот же eval, который выполняется в глобальном контексте.
3. Как проиграть звук используя JS без flash? Какие форматы поддерживаются?
Самое простое решение:
Но этим HTML5 audio не ограничивается. Форматы: Ogg Vorbis, WAV PCM, MP3, AAC, Speex (зависит от конкретного браузера) О форматах: Audio format support
4. На сколько использование глобальных переменных замедляет скрипты?
Зависит от конкретного браузера. В современных браузерах этот момент оптимизирован и разницы нет. В старых доступ до глобальной переменной может быть медленнее в 2 раза.
Вот тест: jsperf.com/global-vs-local-valiable-access
Пожалуйста, учитывайте тот факт, что это тест, каждая операция прогоняется до 1 миллиона раз в секунду. Даже если прирост для теста 30%, то фактический прирост для 1й операции будет мизерный (микросекунды).
5. Как запретить выделение текста на JS?
Есть несколько вариантов.
1. Выполнить preventDefault для событий onselectstart и onmousedown
2. Добавить атрибут unselectable
3. Добавить стиль user-select: none
Есть и безумные решения данной проблемы:
4. По таймеру чистить Range, TextRange, Selection
Не буду объяснять. Как работать с Selection можно посмотреть тут: Range, TextRange и Selection
5. Рендерить текст на канвасе
6. Использовать disabled textarea
Вот микроплагин для jQuery, использующий методы 1-3
Этот плагин не спасет от Ctrl+A Ctrl+C в тех браузерах, которые не поддерживают user-select или unselectable. Помните: запрещать выделение — зло.
6. (function() <>)(); Для чего используется такая конструкция?
Это называется Immediately-Invoked Function Expression (IIFE) — Функция-выражение, которая была вызвана сразу же после создания.
Вот несколько способов создать IIFE
Где это используется:
1. Если вам нужно, чтобы какие-то переменные не попали во внешнее окружение (подобие let)
2. Создание локального замыкания — основа для модулей, объектов, запоминающих состояние
7. Как сбросить события и восстановить состояние элемента?
У нас есть какой-нибудь DOM-объект с изначально заданными при помощи HTML и CSS параметрами «А». В процессе работы мы динамически меняем параметры на «В». Существует ли простой способ «сбросить» состояние объекта первоначальное состояние «А»? Аналогично с событиями. Как сделать откат на первоначальное состояние?
Откатить состояние объекта не получится. DOM не хранит состояние потому, что элементы могут быть получены различным образом: непосредственно из кода html и сгенерированные JavaScript.
С событиями все проще. В DOM есть хороший метод cloneNode. Мы просто клонируем элемент со всем его содержимым (он не будет иметь событий) и подменяем старый элемент новым.
8. Как корректно передавать js-команды с параметрами в ajax приложениях?
Как корректно передавать js-команды с параметрами в ajax приложениях без возни с кавычками? Это относится к передаче данных в ajax-системе, описанной выше способом. При передаче сложных команд с несколькими уровнями вложенности параметров (например, «setTimeout(‘alert(»Бум. «);’, 200);» ) наблюдаются проблемы при использовании кавычек. Как их разрешить или есть ли какие-нибудь общие правила их оформления?
Пересылать код от сервера к клиенту — это плохо. Это аналогично проблеме с eval. Правильно, быстро и безопасно передавать не код, а данные, которые будет обрабатывать браузер.
Можно использовать RPC. Очень прозрачный RPC можно получить, используя NowJS. NowJS — фреймворк, позволяющий выполнять функции на сервере как будето вы выполняете их на клиенте.
Вот пример с сайта:
На сервере: Node.JS server
Просто, прозрачно и красиво!
9. Для чего в jQuery передавать window если он и так глобальный и зачем undefined?
10. Как узнать в какую сторону юзер крутит колесо мыши?
Есть 2 события, реагирующие на скролл колесом ‘ DOMMouseScroll ‘ (Firefox) и ‘ mousewheel ‘ (остальные)
Как навесить событие, думаю всем понятно, посмотрим его обработчик
Не все элементы могут порождать скролл-событие. Зависит от конкретного браузера. Подробнее: scroll and mousewheel
11. Есть ли событие focus у элемента, если нет, то возможно ли его реализовать?
Фокус — это логическое событие, показывающее то, что объект сейчас выделен.
Посмотрите тест событий focus, blur, focusin, focusout, DOMFocusIn, DOMFocusOut :
www.quirksmode.org/dom/events/tests/blurfocus.html
Если слушать все 3 события у элемента, то мы можем определить получил ли любой элемент фокус или нет.
12. Как сделать неизменяемый объект (freeze)?
В ECMAScript 3 (стандарт который поддерживают все движки JavaScript) не было возможности замораживать объект, но в ECMAScript 5 появились сразу несколько функций, ограничивающих изменение объекта.
Object.preventExtensions — самое слабое ограничение. Объект не может получать дополнительные параметры
Object.seal — preventExtensions + любые параметры не могут удаляться
Object.freeze — preventExtensions + seal + параметры становятся только на чтение
Эти новые методы поддерживаются далеко не во всех браузерах
13. Возможно ли сделать кастомную реализацию DomElement так чтобы при разборе для подмножества тегов использовалась она?
Напрямую нет. DOM отделен от JavaScript и поэтому есть некоторые ограничения.
1. Нет конструкторов конкретных элементов — есть только фабрика элементов — document.createElement(») и некоторые методы строки для создания элементов — String.prototype.anchor и тп. HTMLElement и HTMLDivElement — это не конструкторы.
2. Даже если мы эмулируем конструктор, то DOM «очистит» объект после вставки в дерево.
Пример
Однако, мы можем дописать к прототипу «класса» HTML элемента методы и свойства и потом использовать в будущем:
Этот способ будет работать только в современных браузерах. В ИЕ8 и ниже html элементы берутся как будето из воздуха, поэтому их прототипы нельзя переписать на низком уровне:
14. Какой клиентский MVC-фреймворк посоветуете?
Посмотрите все и выберете лучше тот, который вам по душе. Я плотно работал только с Backbone.js
15. Обход ограничений по Referer
На сервере blabla.ru лежит картинка, сервер не отдает её если передал Referer с другого сервера (pewpew.com). Как получить содержимое картинки и показать пользователю?
Напрямую из браузера никак. Можно сделать серверный прокси, который будет менять Referer.
16. GOTO в Javascript
Собственно вопрос как повторить поведение goto в JavaScript. (Про хороший стиль и goto рассказывать не нужно 🙂 речь идёт про генерированный код. и восстановление блоков и циклов процесс весьма не тривиальный)
В JavaScript есть метки, но нет goto (есть только зарезервированное слово). Метка выглядит так же как и во всех других языках, но работают они иначе. Метка выделяет блок. Внутри блока могут быть другие помеченые блоки. На метку можно переходить используя break и continue, которые есть внутри этого блока.
17. Наследование в JavaScript. Как идеологически правильно заэкстэндить Man и Woman от Human
Идеологически правильно использовать прототипное наследование. Процесс наследования хорошо описан в статье «Основы и заблуждения насчет JavaScript»
18. Возможно ли устроиться javascript программистом без копания в верстке и server-side?
Зависит от проекта, размера компании и вашего опыта.
Если вы пойдете разработчиком браузерных-игр в крупную компанию, то шанс, что бы будете заниматься только JavaScript очень высок. Крупная компания может себе позволить отдельного интерфейсного программиста, а мелкая — нет. Вот повезет ли вам без опыта в крупной?!
Если вы только начинаете изучать веб, то вам стоит пойти туда где хотят всего.
Какой транспорт и формат выбрать вам — зависит от требований к приложению. Например, если это чат, то лучше SSE или WebSockets (время доставки сообщения критично). А если этот чат должен работать кроссдоменно и в ИЕ6, то придется добавить магии с iframe или flash.
20. Можно ли подцепить(эмулировать) поведение DOMInputElement’a с помощью обыных DOMElemen’ов(div)?
На низком уровне нельзя. Причину я объяснил в 13-м примере. Можно сделать обертку, которая будет эмулировать Input, в основе которой будет DOMDivElement.
Я набросал простенький эмулятор jsfiddle.net/azproduction/Kz4d9 — получился очень кривой инпут (не умеет сабмититься, не умеет терять фокус и т.п.).
Эту же проблему можно решить более элегантно(спасибо Finom, что напомнил), добавив всего 1 атрибут: contenteditable, который поддерживают только десктопные браузеры — получился тот же инпут, но гораздо проше и лучше jsfiddle.net/azproduction/ZTqRe
21. Проблема приватных и публичным методов
Если возникает желание использовать частные переменные и методы объектов, в JavaScript есть проблема доступа к частным методам из публичных. А привилегированные методы, определенные внутри конструктора, если я правильно понимаю, дублируются для каждого экземпляра, что не очень хорошо с точки зрения производительности. Как насчет такого подхода?
Неплохой подход. По крайней мере лучше, чем объявлять все методы в конструкторе.
22. Как с помощью JS сделать одновременный выбор и загрузку нескольких файлов?
23. При загрузке файлов с использованием File и FormData как определить не пытается ли пользователь загрузить директорию?
При загрузке файлов с использованием File и FormData — как определить не пытается ли пользователь загрузить директорию. Свойство File.type к сожалению не помогает (для некоторых типов, как и для дир — пустая строка), свойство size — тоже (ff и сафари по разному показывают)?
В функции я для подстраховки удаляю callback, чтобы он не вызвался повторно (в будущем поведение FileReader может измениться).
Пример использования jsfiddle.net/azproduction/3sV23/8
Можно, было ограничится размером файла. Если 0, то считать что это не файл (ибо странно загружать файл размером 0 байт).
24. Есть ли в JavaScript аналоги декларациям/аннотациям (термины из Python/Java соответственно)?
Прямых аналогов нет.
PS Если я забыл ответить на какой-то вопрос — задайте его ещё раз. Если у вас есть вопросы, на которых нет ответов ни в первой ни во второй части — задавайте — они будут в третей 😉
