Как использовать import?

Question

[ivandao]

Хочу использовать JSONPath на фронтэнде.
Скачал jsonpath.min.js, подключил его в index.html (нужно ли это?).
В файле со скриптом (index.js) есть json'ы к которым я хочу обращаться при помощи jsonpath.
Может нужно его как-то импортировать?
Как мне его подключить и использовать? В Readme.md приведен пример только для node.js
Подскажите, с меня как всегда

Comments

[Ярослав Иванов]

Ну если вы не можете освоить документацию с примерами то стоит задуматься. Может добавить в неё весёлых картинок?

[ivandao]

Ярослав Иванов, как можно импортировать объект jp (согласно документации)

[Ярослав Иванов]

ivandao, импортировать хз это либа для выбора нужного из джсона)

[Dima Polos]

Подключать в html не надо.

[ivandao]

>импортировать
У меня и вопрос - как импортировать.

[Ярослав Иванов]

ivandao, в нативном джыэс никак
Если только подключать через тег скрипт

[ivandao]

Ярослав Иванов,
> в нативном джыэс никак
Через import тоже?
>Если только подключать через тег скрипт
хорошо, я так сделал, как теперь обратиться к методам из jsonpath?

[Ярослав Иванов]

ivandao, в нативном нет импорта.

[ivandao]

Ярослав Иванов, с 2017 года в языке, или я не так понимаю?

[dollar]

ivandao, в нативном с 2015 года, только сам язык и его реализация не всегда поспевают друг за другом

[ivandao]

dollar, ну с 2015-2017 в большинстве популярных браузерах уже ведь реализовано?
Значит уже можно сказать, что нэйтив.

[Ярослав Иванов]

ivandao, ну когда 90% хотя бы будет поддержка будет реализовано то ок.

Answer 1

[Сергей Соколов]

Скачал jsonpath.min.js, подключил его в index.html (нужно ли это?).

Всё правильно сделали, так тоже можно. После этого у вас должна быть доступна глобальная переменная jsonpath – к ней и обращайтесь:

var cities = [
  { name: "London", "population": 8615246 },
  { name: "Berlin", "population": 3517424 },
  { name: "Madrid", "population": 3165235 },
  { name: "Rome",   "population": 2870528 }
];

var jp = jsonpath; //  для краткости
var names = jp.query(cities, '$..name');
console.log(names); // [ "London", "Berlin", "Madrid", "Rome" ]

Fiddle

Ну а вообще рано или поздно всё равно придётся научиться в модули и сборщики – например, Webpack.

Comments

[ivandao]

> После этого у вас должна быть доступна глобальная переменная jsonpath – к ней и обращайтесь
Благодарю, то что нужно
А имя объекта (в нашем случае jsonpath) как узнать? По сути оно должно быть где-то в jsonpath.js.
Как его там искать? Как Вы вообще узнали его имя?

>Ну а вообще рано или поздно всё равно придётся научиться в модули и сборщики – например, Webpack
Согласен, конечно. Просто хочу разобраться как все работает без них.

[ivandao]

>так тоже можно
А как правильно?

[Сергей Соколов]

ivandao, я посмотрел исходник jsonpath.js – там в самом начале обёртка на все случаи использования:

(function(f){
if(typeof exports==="object"&&typeof module!=="undefined"){
  module.exports=f()
}else if(typeof define==="function"&&define.amd){
  define([],f)
}else{
  var g;
  if(typeof window!=="undefined"){
    g=window
  }else if(typeof global!=="undefined"){
    g=global
  }else if(typeof self!=="undefined"){
    g=self
  }else{
    g=this
  }

  g.jsonpath = f()
}

[Сергей Соколов]

ivandao, как правильно – как вы считаете нужным. Разработчики предусмотрели и такой вариант использования.

[ivandao]

Сергей Соколов,
Я пока слаб в js, мне на какую строку смотреть - на эту?

g.jsonpath = f()

>как правильно – как вы считаете нужным.
Ок, неправильно сформулировал - какой есть еще вариант?

[ivandao]

var jp = jsonpath; // для краткости

А такая краткость память не сжирает в размере jsonpath?
Или поскольку jsonpath - объект, то присваивается ссылка?

[Сергей Соколов]

ivandao, строка та самая, верно. Там if-else три варианта определения библиотеки: ES6 модуль, AMD модуль и глобальные варианты. При простом включении скрипта в страницу сработает вариант с window.

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

[Сергей Соколов]

ivandao, память не съедается. И её много. Очень много, по сравнению с размером модуля. Про ссылку всё верно. Прсто ещё одна переменная ссылается на этот объект.

[ivandao]

Сергей Соколов ,
прошу прощения за нескромный вопрос - как можно получить из приведенного Вами примера JSON'a, например название города, население которого равно 2870528.
А то в примерах, которые фигурируют в интернете приведена немного другая структура json'ов.

[Сергей Соколов]

ivandao, задайте отдельный новый вопрос на Тостере, пожалуйста.

Answer 2

[dollar]

Modules
Что такое export default/ import в js?