What is a query string?

Question

In this exercise, we define a queryParams variable that is set to 'rel_rhy=', which is the start of a parameter for the query string. What is a query string?

Answer

A query string is part of the full query, or URL, which allows us to send information using parameters as key-value pairs.

A query string typically follows a ? in the URL, which in this exercise would be right after https://api.datamuse.com/words?. The key-value pair parameters are sent in the form key=value, and each pair is separated by an & symbol. This will also be covered in the next exercise.

In this exercise, the first parameter of our query string is rel_rhy, and the value of this parameter will be set to whatever text is inputted into the text field.

4 Likes

WHAT IS THE PUPOSE OF const displaySuggestions = (event) => {
event.preventDefault();
while(responseField.firstChild){
responseField.removeChild(responseField.firstChild);
}
getSuggestions();
}

submit.addEventListener(‘click’, displaySuggestions);

AT THE END part 5, GET REQUESTS III? Where is this coming from? It is not part of the module’s excercises?

3 Likes

submit is the name given a cached node, likely an input with type=“submit”.

const submit = document.querySelector('input[type="submit"]');

A cached node is not just a single element. It is a tree-like structure that includes the target element and all its child elements. In this case we know it is a single element, <input type="submit">.

The above notwithstanding, a cached node is an object instance with the name we give it.

Every node object has an addEventListener method. This registers a ‘click’ event with a handler function specified by reference, known as the callback. In this case, a click on the target element will fire that function.

The function binds itself to the global event object of which there can only ever be one; the most recent event must be handled before another event can be triggered.

event is an object instance with it’s own attributes and methods, of which preventDefault is one. Browsers have built in behavior on the Submit button. If not prevented, it assembles all the input data of the form controls into a query string known as POSTDATA which is then affixed to the request URL specified in the action="..." attribute of the <form> OPENTAG.

event.preventDefault() short-circuits that process and lets the handler (or program) take control of the form data.

The name of this callback function suggests (pun not intended) there may be none or more items in a list (an array or an object as applies) and its role is to clear that list so it is empty when the loop ends. The final instruction invokes a global function to, as it were, repopulate that suggestion list.

8 Likes

what is cached node ? how object in this case is made without using new keyword.

2 Likes

In this exercise I just realize that ‘rel_rhy=’ is the query parameter that provided by ‘datamuse api’ , after i read the documentation it explain that
rel_[CODE] : is used for related Word, the [CODE] can be replaced with other code provided in the documentation such as

  1. rel_ant= : for antonyms
  2. rel_jja= : for popular nouns modified by the given adjective, per Google Books Ngrams
  3. rel_rhy= : for Rhymes (“perfect” rhymes, per RhymeZone)
5 Likes
  if(!res.length){
    responseField.innerHTML = "<p>Try again!</p><p>There were no suggestions found!</p>";
    return;
  }

the above code use only “return” . can anyone tell me what will return value ?

Hi,

First off, probably a good idea to search first in the forum and if you don’t find your query, create a new thread, like they explain here, since you have more chances of being answered, and given that this thread seems to be slightly unrelated to your question. :slight_smile:

Having said that, if I understand correctly your question, that type of return is much more about exiting the function than about returning a value.

Actually, since in JavaScript the default return value of a function is undefined, and if you type return without a value, you will still return undefined, then that would seem a little redundant, no?

Well, not really, turns out you are not making sure to return undefined, you are actually telling JS exit this function now and ignore the rest.

So, to answer your literal question: the value you would return is undefined.

To answer your implied question (why then?) : because by doing that, you exit the function at that point without executing the rest of the code that comes after that line.

2 Likes