KnockoutJS Interview Questions and Answers
Q1. What is KnockoutJS ?
Q2. How KnockoutJs exceptional from MVC?
KnockoutJs is a MVVM pattern.
KnockoutJs paintings like linked mode.
Knockout s supported forms of binding.
In KnockoutJs, UI element routinely replace when your data model update.
In KnockoutJs, version component isn't directly bind with the view web page. Models at once bind with the view-model and view-model immediately with the view web page.
MVC is a layout sample.
MVC work like disconnected mode.
MVC supported best one-manner binding.
In MVC, not replace UI routinely when your information model replace. Need occasion to call facts version and update it.
In MVC, model parts at once bind with the view web page.
Q3. What Are the principle features of KnockoutJs?
Dependency Tracking - KnockoutJs make dependency among View and ViewModel. Its track the any modifications on based objects and it's miles automatically updating the UI (DOM) whilst your information fashions are alternate.
Declarative Binding - The Declarative Binding presents the approaches, your UI (DOM) is hooked up together with your records models in a without a doubt manner using control.
Template Binding– The Template bindings are used for construct sophisticated UI in effortlessly. It’s populate the DOM elements within the nested and repeating manner with the help of for-each, if, with, and different control glide bindings and 0.33 party template engine.
Automatic UI (DOM) Refresh – The KnockoutJs robotically refresh the UI (DOM) you’re your ViewModel replace. If any modifications came about in the ViewModel facts automatically refresh on view/UI/DOM.
Compact Size – The KnockoutJs length is round 13kb. It is just too small and handy to apply.
Support All Modern Browsers– The KnockoutJs assist most of the modern browsers like -IE 6+, Firefox 2+, Chrome, Safari, others.
Q4. Why is KnockoutJS useful ?
Ans: Knockout can dramatically lessen the quantity of code needed to synchronize a data version and user interface controls. It is speedy, cross browser well matched, and not reliant on every other libraries. It is light-weight (< 20kb after compression) and may be without problems incorporated with most net packages with none principal architectural replace.
Q5. How do you activate a Knockout Model ?
Ans: To activate a model, we call the important thing technique ‘ko.ApplyBindings’, passing inside the call of the version to bind to as a parameter. ‘ko.ApplyBindings(MyNewKOModel)’.
Q6. What Is observable in Knockout JS?
Ans: The Observable is a KnockoutJs belongings that incorporates the view version and this assets is bind with UI (View) in two way binding.
Q7. What Is computed observable?
Ans: The Computed observable is a KnockoutJs characteristic which is depends on the other observable residences. Computed feature are mechanically replace when any changes on those dependencies.
Q8. Describe a Knockout ViewModel
Q9. What is two manner statistics binding ?
Ans: Knockout uses the “records-*” tags to create a live dynamic link among a browser UI manipulate, and a member or technique inner a records ViewModel. If you have a statistics model with a discipline ‘FirstName’ and an edit field linked the usage of the facts-bind attribute to ‘FirstName’, then anytime the records model modifications (as an instance programmatically), that exchange right away indicates within the edit container, and any time a user makes a trade to the FirstName within the edit box, the underlying facts within the area ‘FirstName’ is changed.
Q10. How do you call a Knockout approach using information bind concept ?
Ans: Knockout allows us to use the records-bind idea to hook into user manage object occasions consisting of ‘click’. To do this, we use a ‘facts-bind’ with the technique we need to name as the click parameter ‘data-bind=”click: callSomeMethod”’.
Q11. What is a use of templates in Knockout and how are they coded ?
Q12. What kinds of facts binding are to be had in knockout JS?
Ans: There are special styles of records bindings and its looks as if-
textual content binding
Q13. How do you seek or sort an observable array ?
Ans: You can seek and kind the usage of a ‘ko.Computed’ function. The computed feature may want to enforce an ‘arrayFilter’ name from the Knockout utils library to look, and a relevant compare (on string, number, date) for the sort. In all cases, the computed function filters out what it doesn’t want and returns information for that reason.
Q14. How do you prepare a Knockout item for data transfer ?
Q15. What is the motive of the mapping plugin ?
Ans: When loading statistics into a viewModel, if it's miles complex with nested arrays, it could be tough to unwrap all members manually. The mapping plugin assists with this and lets in you to tell Knockout the way to cope with complex statistics like systems with nested arrays by means of presenting sample features.
Q16. What is a binding, what are the binding kinds, and what are they used for ?
Ans: A binding is a html mark-up attribute that is added to an html detail to create a link between the html manage detail and a knockout item. It takes the format ‘data-bind:<binding-type:value>’. There are binding sorts to help with items like manipulate textual content, visibility and CSS styles, and different types to assist with shape fields including fee, submit, occasion, and so on. Bindings is probably used to show the name label of a page, the visibility of a checkbox, and manage the information access in form field.
Q17. How To Creating Custom bindings in knockoutJs?
Ans: When we create custom binding, we need to feature a property together with your custom binding name and assign an object with two callback functions.
Registering your binding - To register a binding, provides it as a sub belongings of “ko.BindingHandlers” and its looks like.
init: function(detail, valueAccessor, allBindings, viewModel, bindingContext)
// Set up any your initial state, event handlers, and so on
replace: characteristic(element, valueAccessor, allBindings, viewModel, bindingContext)
// Update the DOM detail primarily based at the furnished values.
DOM elements –
<div data-bind="myCustomBinding : yourValue"> </div>
Q18. How are you able to manipulate flow with bindings ?
Ans: When you've got an array of objects in a Knockout viewModel, you can tell your mark-up to iterate through them using the information-bind ‘for-each’ as an instance.
Q19. Give a gain of the use of Knockout shape binding
Ans: Normal capability we'd enforce round form fields such as getting/placing the sphere cost, hooking occasions, and so forth. Can be carried out the usage of ‘form statistics-bind’. A gain of doing this is that we permit control of the form to be tied to the data version and its policies.
Q20. How do you delete an object from a Knockout array ?
Ans: Use the put off or removeAll techniques, passing in the item you want to match for deletion.
Q21. How might you flag an object deleted and why is this beneficial ?
Ans: In instances in which you want to manage an array of present information as an instance browser-aspect, and inform the server of both additions, modifications and deletions, you can flag an array object the use of the ‘wreck’ or ‘destroyAll’ technique. This creates a grimy file that is flagged “_destroy” and can be without difficulty identified server-facet for coping with within the data repository.
Q22. Name two context residences in Knockout and provide an explanation for their use
Ans: When working with arrays, the $index property returns the index of the modern context item in the array. When operating with nested objects, the $figure belongings lets in us to look at the parent of an item, for example a purchaser may have many orders, an order might also have many line objects. The order is the discern of the road object, the purchaser is the discern of the order.