Java script interview question and answers | Java script training | Edureka Rewind

Key Takeaways

hi everyone this is shinon from urea and today's session is about JavaScript interview questions so this is going to help you if you are looking for any profile based on JavaScript so let's have a look at the agenda of today session now we shall begin with a brief history on JavaScript and then have a look at the salary trends of the language with comparison to other popular languages next up we will see some of the big companies that are using JavaScript we have also divided our interview questions in three sections first we will have a look at the beginner level JavaScript questions next up we will move on to the intermediate level and finally we will have a look at some of the advanced level JavaScript interview questions so let's get started JavaScript was created by Brendan Ike in 1995 during his time at Netscape Communications now it was inspired by Java scheme and self now Netscape for a Time made the best browser in the world and enjoyed market dominance the Prototype of mocha was integrated into Netscape Communication in May 1995 but in short time it was renamed to live script now at that moment the word live was convenient from a marketing point of view now in December 1995 the Netscape Communications and Sun closed to the deal sooka or livescript was renamed as JavaScript and it was also presented as a scripting language for small client side tasks in the browser while Java would be promoted as a bigger professional tool to develop Rich web components now this first version of JavaScript set in stone many of the traits the language is known for today in particular its object model and its functional features were already present in this first version now Microsoft implemented their own version of JavaScript called the jscript now keeping Java of the name avoided possible trademark issues however jscript was different in more than just name slight differences in implementation in particular with regards to certain Dom functions caus dles that would still be felt many years into the future now JavaScript wars were fought in more fronts than just names and timelines and many of its Quicks are just the wounds of these wars now the first version of jscript was included with Internet Explorer 3.0 and released in August 1996 nodejs V8 and other projects have brought JavaScript to places it was never thought for and the active proposals in different stages are all making javascripts future as bright as ever it's been a long road full of bumps and JavaScript is still one of the most successful languages ever that's a testament in itself so now let's have a look at the salary trend of programmers and developers using JavaScript this graph shows the average salary for various other programming languages as compared to JavaScript and we can see that it has a higher pay scale than most of the other languages so now let's move on and check out some of the companies that are using JavaScript some of the popular names include Airbnb Instagram Reddit stackshare and eBay so now that you have had an overview about JavaScript let's start with the interview questions so the first question is what is Javascript now JavaScript is a lightweight interpreted programming language with object oriented capabilities that allows us to build interactivity into otherwise static HTML Pages now the general purpose core of the language has also been embedded in Netscape Internet Explorer and other web browsers next up one of the most commonly asked question is what is the difference between Java and JavaScript now Java is basically a complete programming language in contrast JavaScript is a coded program that can be introduced to HTML Pages now these two languages are not at all interdependent and are designed for the different intent Java is an objectoriented program or a structured programming language like C++ or C whereas JavaScript is a client side scripting language moving on the next question is what are the data types supported by JavaScript now in JavaScript there are two different kinds of data the first one are the Primitive types and the second one is the objects now A Primitive is simply a data type that is not an object and has no methods in JavaScript there are six primitive data types so we have undefined null bullan string symbol and number which are considered to be the primitive data types and also the other type is known as the object data types the next question is what are the features of JavaScript now JavaScript is most commonly used as a client side scripting language this means that JavaScript code is written into an HTML page when a user requests an HTML page with JavaScript in it the script is sent to the browser and it's up to the browser to do something with it so let's discuss some of the features of JavaScript it is an object based scripting language which gives the user more control over the browser it is a lightweight interpreted programming language it is also designed for creating Network Centric applications it handles the date Center times and detects the users's browser and Os JavaScript is also an interpreter based scripting language it is complimentary to and integrated with Java it is also complimentary to and integrated with HTML now JavaScript is object based language as it provides predefined objects and every statement in JavaScript must be terminated with semicolon now most of the JavaScript control statement syntax is same as syntax of control statements in the C language now an important part of JavaScript is the ability to create new functions within scripts also declare a function in JavaScript using the function keyword another important feature is that JavaScript is open and crossplatform programming language but JavaScript also have some limitations like the client side JavaScript does not allow the reading or writing of the files and it cannot be used for networking applications because there is no such support available it also does not have any multi-threading or multi-processor capabilities now next question is is Javascript a case sensitive language yes of course now JavaScript is a case sensitive language so whenever we use the keywords or variables function names or any other identifiers it must always be typed with a consistent capitalization of letters otherwise it would not be considered in JavaScript now moving on next question is what are the advantages of JavaScript so let's have a look at some of the advantages the first one is less server interaction now we can always validate the user input before sending the page off to the server this saves server traffic which means less load on our server next up it gives immediate feedback to the visitors so they don't have to wait for a page reload to see if they have forgotten to enter something there's always an immediate feedback next up it's increased interactivity so you can always create interfaces that react when the user hovers over them with a mouse or activates them via the keyboard JavaScript also has richer interfaces so you can use JavaScript to include such items as drag and drop components and Sliders to give a rich interface to your site visitors now moving on the next question is how can you create an object in JavaScript just like classes are used for creating object objects in Java C we can use Constructors to create objects in JavaScript now objects can be created using the Constructor function syntax using the following two steps so first we Define the object by defining the Constructor function and one of the easiest way to instantiate an object in JavaScript is by defining a classical JavaScript function and create an object of the function using the new keyword here we have a variable employee with the the objects name and age so this is one example of how we can create an object in JavaScript in one of the most simplest ways now moving on the next question is how can you create an array in JavaScript so let's see how we can declare an array so there are basically two ways to declare an array first is the initialization of the array an array in JavaScript can hold different elements so we can store numbers strings and Boolean in a single array accessing array elements the length property of an array the JavaScript array object is a global object that is used in the construction of arrays which are high level list like objects so in this example we have two variables X and Y in the first one variable X is an array with undefined values that is no particular value has been defined inside the array X but in the next case in variable y we have defined five values inside the array we have the numerals from 1 to five that has been declared inside this particular array now this gives a constant value to the array but in the first one the values are undefined and we can provide any value inside this the next question is what is a name function in JavaScript and how to define it now a function is a parametric block of code defined one time and called any number of times later now in JavaScript a function is comp post and influenced by many components a function is a JavaScript procedure a set of statements that performs a task or calculates a value now to use a function you must Define it somewhere in the scope from which you wish to call it a JavaScript function is defined with the function keyword followed by a name and followed by the parenthesis so basically a named function has a name when it is defined we can Define it using the function keyword so in this example you can see that we have used the function keyword and given the name to our function as named so this is how you can define a function in JavaScript now the next question is can you assign an anonymous function to a variable and pass it as an argument to another function yes in JavaScript it is possible to assign an anonymous function to a variable we can always declare a variable and provide any Anonymous function along with it also we can pass it as an argument to another function so the answer to both would be yes the next question is what is argument objects in JavaScript and how to get the type of arguments passed to a function the arguments object is a local variable available within all non Arrow functions now you can refer to a function's arguments inside that function by using its argument objects it has entries for each argument the the function was called with with the first entries index at zero it is basically a local variable accessible within all functions and contains an entry for each argument passed to that function the argument's object is an array like construct which can be used to access arguments passed to the function even if a matching parameter is not explicitly defined now JavaScript variable arguments are the arguments passed to a function we can pass this using the type of operator so in this example you can see how we have used the type of operator and passed our argument length we have three functions here in the first one there is the undefined value which is zero in the second one we have a number that is one defined inside the function in case of the third function we have defined strings and the length of the string is three as we have passed three values inside that particular function so this is how we can get the type of arguments passed to a function in JavaScript the next question is what are the Scopes of a variable in JavaScript so the scope of a variable is basically the region of our program in which it is defined now JavaScript variable has two Scopes the first one is the global variable and the second one is the local variable now a global variable basically has Global scope which means it is visible everywhere in your Java script code whereas a local variable will be visible only within a function where it is defined and the function parameters are always local to that particular function the next question is what is the purpose of this operator in JavaScript now this is an interesting question this operator in JavaScript is quite a famous one now differently from the other languages in JavaScript this always refers to the owner of the function that we are are executing or rather to the object that the function is a method of now the JavaScript this keyword refers to the object it belongs to this has different values depending on where it is used in a function this refers to the global object in a function in strict mode this is undefined now a function in JavaScript is also a special type of object every function has call bind and apply methods now these methods can be used to set custom value of the this operator to the execution context of function so the next question is what is callback now a call back is basically a function that is to be executed after another function has finished executing hence the name call back now more complexly put in JavaScript functions are objects because of this functions can take functions as arguments and can be returned by other functions some of the call backs are also events that are called to give the user a chance to react when a certain stage is triggered next up what is closure also give an example so closures are created whenever a variable that is defined outside the current scope is accessed from within some inner scope a closure basically gives us the access to an outer functions scope from an inner function in JavaScript closures are created every time a function is created and at function creation time now to use a closure simply Define a function inside another function and expose it like you can see in this example we have created the function create which can also be accessed from the inner scope next up let's have a look at some of the built-in methods and what values do they return so the first built-in method is Scare at now this Returns the character at the specified index next up we have the concat built-in method now this Returns the character at the specified index third one is the for each built-in method now this calls a function for each element in the array next up we have the index of it Returns the index with the calling string object of the first occurrence of the specified value next up the length built-in method Returns the length of the string we also have the pop and push the pop removes the last element from an array and returns that particular element whereas push adds one or more elements to the end of an array and Returns the new length of the array the reverse function reverses the order of the elements of an array so these were some of the built-in methods and the values that they return the next question is what are the variable naming conventions in Java Script now in computer programming a naming convention is basically a set of rules for choosing the character sequence to be used for identifiers which denote variables types functions and other entities in source code and documentation while naming your variables in JavaScript we must keep some rules in mind the following are the variable naming conventions in JavaScript so we should not use any of the JavaScript reserved keywords as a variable name for example break or Boolean variable names are not valid we cannot use such names as our variable names and it must be something unique the next rule says that JavaScript variable names should not start with a numeral that is any value from 0 to 9 they must begin with a letter or an underscore character for example if a variable name is something like 1 2 3 test it is an invalid variable name but if we start it with underscore or any letter it will be a valid one the third and the final rule says that JavaScript variable names are case sensitive so we must be careful while naming our variables and must not mix the uppercase and the lowercase letters so these are some of the rules we must keep in mind while naming our variables in JavaScript now moving on the next question is how does type of operator work now the type of operator is used to get the data type of its operant the operant can be either a literal or a data structure such as a variable a function or an object now it is a AR operator that is placed before its single operant which can also be of any type its value is basically a string which indicates the data type of the operand next up how to create a cookie using JavaScript so JavaScript can create read and delete cookies with the document. cookie property so this is the simplest way where we can assign a string value to the document. cookie object the syntax shows how we can create a cookie in JavaScript we just take the document. cookie object and pass the string value such as here we have passed key1 and given the value one key2 with value two and expiry date as well so now that you know how to create a cookie let's see how to read a cookie using JavaScript So reading a cookie is just as simple as writing one because the value of the document. cookie object is the cookie now the document. cookie string will keep a list of name which are equal to the value pairs which separated by semicolons we can also use the strings split function to break the string into key and values the next question is how to delete a cookie using JavaScript so if you want to delete a cookie so that subsequent attempts to read the cookie returns nothing so all you need to do is just set the expiration date to a time in the past now you should Define the cookie path to ensure that you delete the right cookie some browsers will not let you delete a cookie if you don't specify the path so the next question is what is the difference between attributes and property so there has been a lot of confusion regarding what is the difference between these two so let's have a look what is an attribute so attributes provide more details on an element like ID type value Etc whereas property is basically the value assigned to the property like for type we can provide text and for Value we have name so here we are setting the type as text which is a string and for the value we have a type which is the name so this is the basic difference between the two now moving on so these were some of the most commonly asked beginner level set of JavaScript questions so let's move on to the intermediate level JavaScript interview questions the next question is list out the different ways an HTML element can be accessed in a JavaScript code so these are the list of ways an HTML element can be accessed in a JavaScript code the the first one is the get element by ID now this basically gets an element by its ID name the next one is the get Elements by class it gets all the elements that have the given class name the third one is the get Elements by tag name basically this one gets all the elements that have given the tag name the final one is the query selector now this function takes CSS style selector and Returns the first selected element the next question is in how how many ways a JavaScript code can be involved in an HTML 5 so there are three ways in which a JavaScript code can be involved the first one is the inline second one is internal and the final one is external an inline function is a JavaScript function which is assigned to a variable created at runtime so you can difference inline functions easily with Anonymous since an inline function is assigned to a variable and can be easily reused so whenever you need a JavaScript script for a function you can either have the script integrated in the page you are working on or you can have it placed in a separate file that you call when needed so this is the difference between an internal script and an external script next up what are the ways to Define a variable in JavaScript so there are basically three possible ways of defining a variable in JavaScript the first one is the where the second one is const and the third one is let now the JavaScript variable statement is used to declare a variable and optionally we can initialize the value of that variable the scope of a JavaScript variable declared with where is its current execution context now const is basically a signal that the identifier want to be reassigned whereas let is a signal that the variable may be reassigned such as a counter in a loop or a value swap in an algorithm it also signals that the variable will be used only in the Block it's defined in which is not always the entire containing function the next question is what is a typed language now unlike Java or C which are strongly typed languages JavaScript is smart and hence is also called a weakly typed language now you don't have to specify the data type or your variable while declaring it JavaScript is smart enough to interpret what variable type you want to use typed language is in which the values are associated with values and not with variables now type languages are of two types dynamically typed language and statically typed language now in dynamically typed languages the variable can hold multiple types like in JavaScript a variable can take numbers and characters whereas in statically typed languages the variable can hold only one type like in Java a variable declared of string can take only set of characters and nothing else now the next question is what is the difference between local storage and session storage now session storage and local storage both are used to store data on the client side now each one has its own storage and expiration limit session storage is similar to local storage but expires when the browser closed in case of a local storage the data is not sent back to the server for every HTTP request reducing the amount of traffic between the client and the server in case of local storage it will stay until it is manually cleared through settings or program but in session storage it will leave when the browser is closed now moving on the next question is what is the difference between the operators double equals and triple equals now this is another most commonly asked question because a lot of us get confused between these two operators and most of the time mix up with their users now in one word main difference between the double equals and and triple equal operator is that formally Compares variable by making type correction for example if you compare a number with a string with numeric literal the double equals allows that but the triple equals does not allow that because it not only checks the value but also type of two variable if two variables are not of the same type the triple equal returns false while the double equals returns true now if we consider the double equal operator this is a permissive value equality sign it checks for equality between two variable after trying to parse them to the best format whereas the triple equal operator is a less permissive value equality it checks for value and type equality of the two evaluated variables so it is the recommended way to test for equality and is much more safer so we prefer it to the pre previous operator to avoid bad surprises so I hope now you're clear about the difference between these two operators and you would not mix up while using any of these operators so the next question is what is the difference between null and undefined now undefined means that a variable has been declared but has not yet been assigned a value on the other hand null is an assignment value so it can be assigned to a variable as a representation of no value also undefined and null are two distinct types so undefined is a type itself while null is an object the next question is what is the difference between Undeclared and undefined now Undeclared variables are those that do not exist in a program and are not declared now if the program tries to read the value of an Undeclared variable then a runtime error is encountered whereas undefined variables are those that are declared in the program but have not been given any value so if the program tries to read the value of an undefined variable an undefined value is returned the next question is name some of the JavaScript Frameworks now a JavaScript framework is an application framework written in JavaScript it differs from a JavaScript library in its control flow so there are many JavaScript Frameworks available in the market but some of the most commonly used Frameworks are the angular reactjs and view now angularjs is a JavaScript based open-source front-end web application framework mainly maintained by Google and by a community of individuals and corporations to address many of the challenges encountered in developing single page applications next is the react or the reactjs it is a JavaScript library for building user interfaces it is maintained by face Facebook and a community of individual developers and companies the third one is view now view is a progressive framework for building user interfaces unlike other monolithic Frameworks view is designed from the ground up to be incrementally adoptable the next question is what is the difference between window and document in JavaScript so there has always been a confusion between the two so let's see what is a window now a Javas script window is basically a global object which holds variables functions history and location whereas the document also comes under the window and can be considered as the property of the window on the other hand the document comes under the window and can be considered as the property of the window so document is basically a subset of the window itself next up what is the difference between inner HTML and inner text now the inner HT HTML will process an HTML tag if found in a string but inner text will not process an HTML tag if found in a string so the former one processes a tag whereas the later one does not process any tag even if found in a string the next question is what is an event bubbling in JavaScript now event bubbling and capturing are two ways of event propagation in the HTML Dom API when an even Talkers in an HTML inside another element and both elements have registered a handle for that particular event now with bubbling the event is first captured and handled by the innermost element and then propagate it to Outer elements so when an event is fired on an HTML element the execution starts from that particular event and goes to its parent element then the execution passes to its parent element and so on till the body element the next question is what is Nan in JavaScript now the unquoted literal constant Nan is a special value representing not a number since Nan always Compares unequal to any number including Nan it is equally used to indicate an error condition for a function that should return a valid number so we should always use the isan global function to see if a value is not a number so whenever a string or something else is being converted into a number and that cannot be done we get to see the na and in JavaScript so the next question is how do JavaScript primitive or object types passed in functions so one of the differences between the two is that primitive data types are passed by value and objects are passed by reference by value means creating a copy of the original for example we can consider twins now they are born exactly the same but the first twin wouldn't lose a leg if the second one loses his in the war Now by reference means creating an allies to the original for example we all have an original name and a nickname now this doesn't suddenly give birth to a clone of ourselves we are still one but we can be called by these two very different names next up how can you convert the string of any base to integer in JavaScript so we use the parse in function in order to convert numbers between different bases so it takes the Str to be converted as its first parameter and the second parameter is the base of the given string so here is an example that shows how you can convert the string of any base to the integer in JavaScript so we have the string 4f that is to be converted which is the first parameter and the second parameter is the base of our given string so the base of 4f is 16 and this would provide the integer value of the particular string now moving on the next question question is what would be the result of 2 + 5 + 3 now this looks very simple but if you look carefully there's a difference between the three numeral values declared here the first two numeral values are outside the double quote whereas three is defined inside double quotes now what is the difference so two and five are basically integers here and since both these are integers they will be added numerically which equals to 7 and since three is a string its concatenation will be done so we will get the result as 2 + 5 which equals to 7 and three would be concatenated so the result would be 73 so you should be careful while adding the values because a double code can change its entire meaning now the next question is what are exports and imports so imports and exports help us to write the modular JavaScript code Now using these two we can split our code into into multiple files now in the following example we will see how we have split our code the first one is the index.js and the second file is the person. JS now in index we are importing our name and date of birth from our person file so here we have taken the name and the date of birth which has been declared in another file named as person now in person we have declared our name as Daniel occupation and the date of birth and we have used the export function so we are exporting the objects name and the date of birth here we have declared three objects that is the name occupation and the date of birth but only the two that is the name and the date of birth are to be exported to our another file called as the index so we have used the export function and we have declared name and do which now can be exported in the index so now both these files have access to the name and the date of birth so we have reached the final section and now we will have a look at some of the advanced level JavaScript interview questions what is the strict mode in JavaScript and how can it be enabled now a strict mode is basically a way to introduce better error checking in our codes now whenever we use the strict mode we cannot use implicitly declared variables or assign a value to a readon property or even add a property to an object that is not extensible we can enable strict mode by adding use strict at the beginning of a file a program or any function next up what is a prompt box in Javas script now the prompt method displays a dialogue box that prompts the visitor for input a prompt box is often used if you want the user to input a value before entering a page so whenever a prompt box pops up the user will have to click either okay or cancel to proceed after entering an input value it is basically a box which allows the user to enter input by providing a text box and label and box will be provided to enter the text or the number now the next question is what will be the output of the following code so let's have a look at the code first now in this code we have first declared a variable y with the value one now the if condition statement evaluates the function f here in the next step we have added the Y value to the function f and and finally we have written the value of y into the browser using console. log now let's see what would be the output of this following code now the output would be one undefined because the if condition statement evaluates using the eval so the eval function f returns function f which is true therefore inside the if statement executing type of f returns undefined because the if statement code executes at runtime and the statement inside the if condition is evaluated during runtime so therefore it will give us the value as one undefined the next question is what is the difference between call and apply now the call method calls a function with a given this value and arguments provided individually so here is the Syntax for the call method so first we take the function do call which has the this argument and along with the we pass the arguments as argument one and argument 2 Etc now next up the apply method calls a function with a given this value and arguments provided as an array so the syntax shows that first we take the function. apply which has the this argument and along with it we just pass the argument as an array along with the this argument so this is the basic difference between call and apply in one we have the arguments passed individually on the other other hand we pass the arguments as an array the next question is how to empty an array in JavaScript now for this we have four different methods the first method is using an undefined array list we can declare it as array list and undefined now the above code will set the variable array list to a new empty array now this is recommended if you don't have references to the original array array list anywhere else because it will actually create a new empty array so you should be careful with this method of emptying the array because if you have referenced this array from another variable then the original reference array will remain unchanged now the next method is using the array. list length as zero so the above code will clear the existing array by setting its length to zero now this way of emptying the array also updates all the reference variables that point to the original array therefore for this method is useful when you want to update all reference variables pointing to the array list the third method is not so popular but we can still use it the implementation of the above code will also work perfectly this way of emptying the array will also update all the references to the original array the final method is using the pop method now the implementation of the above code can also empty arrays but it is usually not recommended to use this method often so these were some of the ways in which you can empty an array in JavaScript the first and the second one are the most commonly used methods now the next question is what will be the output of the following code let's have a look at the code so we have a variable with the name output inside which we have declared the function X in the next step we have deleted a variable X and also returned the value of x now finally we are writing into the browser the value of output now let's see what output will it provide us here the output would be zero because the delete operator is basically used to delete properties from an object but here X is not an object but a local variable here x is basically a function declared inside the variable output so the delete operators would not affect the local variables that's exactly why we will get the output as zero now the next question is what will be the output of the following code so let's have a look at the code here we have two variables the first one is variable X and the second one is the output inside variable X we have the foo value as one and inside output we have a function declared next step we have deleted the x. Foo and returned the value of x. fo now let's see what output does it give us so the output would be undef defined the delete operator here is used to delete the property of an object but here x is an object which has the property Foo and as it is a self invoking function we will delete the foo property from object X itself now after doing so when we try to reference a deleted property fo the result is undefined because basically there's no more value left that is to be shown so the output would be undefined in this case the next question is what will be the output of the following code in this code we have a variable declared named as employee and inside which we have an object named as company and the name of the company is XY Z the next variable is the emp1 now in this case we will delete the emp1 do company and console the value of emp1 do company and see what value do we get as our output now our outp put would be XY Z because here the emp1 object has company as its prototype property because in the variable emp1 we have declared it as object. create employee so the delete operator does not delete the Prototype property emp1 object does not have company as its own property however we can delete the company property directly from the employee object using delete employee. company so here we will get our output as XY Z next question we have another code and what would be the output of this so in this one we have a named function expression so we have declared a variable fo oo using the function bar which returns seven now in this case the output would be reference error because a function definition can have only one reference variable as its function name here we have used the function bar for the variable fo and again we are using using it in case of the type of so this would give us a reference error now moving on to the next question what is the reason for wrapping the entire content of a JavaScript source file in a function book now this is an increasingly common practice employed by many popular JavaScript libraries so this technique creates a closure around the entire contents of the file which perhaps most importantly creates a private name space and thereby helps avoid potential name clashes between JavaScript modules and libraries now another feature of this technique is to allow for an easily referenceable allies for a global variable this is often used in jQuery plugins now the jQuery allows you to disable the dollar reference to the jQuery namespace using the jQuery do no conflict the next question is what are Escape characters in JavaScript now JavaScript Escape characters enables us to write special characters without breaking the application now the Escape character that is the backs slash is used when working with special characters like single quotes double quotes apostrophes and ersen we usually Place The Backs slash before the characters to make it display so here is an example of the Escape character so usually whatever we write inside the double quote is considered to be a string but what if you want to print the double quotes as well so in this casee you can see in the next line we have used a backs slash before the first double quote and a backs slash before the ending as well this means that the double quote inside which good is written would be printed and the rest is considered to be a string so with this we have come to the end of our session today we have covered the three sections that is the beginner intermediate and also the advanced level JavaScript interview questions hope you liked today's session and hope it will help you crack your interviews till then thank you and happy learning