### Introduce the basic data types of JS.
Undefined, Null, Boolean, Number, StringCopy the codeWhat built-in objects does JS have?
Object is the parent Object of all objects in JavaScript: Object, Array, Boolean, Number, and String Function, Arguments, Math, Date, RegExp, ErrorCopy the codeWhat are some basic rules for writing JavaScript?
1. Do not declare multiple variables on the same line. 2. Please use ===/! = = to comparetrue/falseOr number 3. Use object literals instead of the new Array form 4. Do not use global functions. 5.Switch statements must have default branches 6. Functions should not sometimes return a value and sometimes not return a value. If statements must use curly braces 9. Variables in for-in loops should be explicitly scoped with the var keyword to avoid scope contamination.Copy the code###JavaScript prototype, prototype chain? What are the characteristics? Every object initializes a property inside of it, called prototype. When we access an object’s property, if the property doesn’t exist inside the object, the object will look for the property in Prototype, which in turn will have its own prototype. And so the search goes on and on, and that’s what we call the prototype chain.
Relationship: the instance constructor. The prototype = instance. Proto features: JavaScript object is passed by reference, we create each new object entities and not a belongs to own a copy of the prototype. When we modify the stereotype, the objects associated with it inherit the change. When we need a property, the Javascript engine looks to see if the property is present in the current Object, and if not, looks for the property in its Prototype Object, and so on, until it reaches the Object built-in Object.
function Func(){} Func.prototype.name = "Sean";
Func.prototype.getInfo = function() { returnthis.name; } var person = new Func(); Var person = object.create (oldObject); console.log(person.getInfo()); // It has Func attributes and methods //"Sean"
console.log(Func.prototype);
// Func { name="Sean", getInfo=function()}
Copy the codeHow many types of values does JavaScript have? Can you draw their memory map? Stack: primitive data type (Undefined, Null, Boolean, Number, String)
Heap: Reference data types (objects, arrays, and functions)
The difference between the two types is: storage location is different; Primitive data types are directly stored in simple data segments in the stack, occupying small space and fixed size. They are frequently used data, so they are stored in the stack. Reference data type Objects stored in the heap occupy large space, size is not fixed, if stored in the stack, will affect the performance of the program; The reference data type stores a pointer on the stack to the starting address of the entity in the heap. When the interpreter looks for a reference value, it first retrieves its address in the stack and then retrieves the entity from the heap
How does Javascript implement inheritance? Prototype mechanism or apply and call methods to implement the simple, it is recommended to use the constructor and prototype hybrid mode.
function Parent(){
this.name = 'wang';
}
function Child(){ this.age = 28; } Child.prototype = new Parent(); Var demo = new Child(); alert(demo.age); alert(demo.name); // Get the inherited attribute}Copy the codeHow many ways to implement JavaScript inheritance?
- Reference: constructor inheritance, non-constructor inheritance;
How many ways can javascript create objects? Javascript creates objects simply by using built-in objects or a variety of custom objects, including JSON. But there are many different ways to write it, and you can mix it up.
Person ={firstname:"Mark",lastname:"Yun",age:25,eyecolor:"black"}; 2, usefunctionTo simulate a constructor with no argumentsfunction Person(){} var person=new Person(); // Define onefunctionIf new is used"Instantiate"thefunctionYou can think of it as a Class person.name="Mark"; person.age="25";
person.work=function(){
alert(person.name+" hello..."); } person.work(); 3, withfunctionTo simulate the parameter constructor (use this keyword to define the context properties of the construct)functionPet(name,age,hobby){ this.name=name; //this scope: the current object this.age=age; this.hobby=hobby; this.eat=function(){
alert("My name is"+this.name+"I like it."+this.hobby+"He's a programmer.");
}}
var maidou =new Pet("McDull", 25,"coding"); // instantiate and create object maidou.eat(); Var wcDog =new Object(); wcDog.name="Prosperous wealth.";
wcDog.age=3;
wcDog.work=function(){
alert("I am"+wcDog.name+", woof woof......"); } wcDog.work(); 5. Prototypefunction Dog(){ }
Dog.prototype.name="Prosperous wealth.";
Dog.prototype.eat=function(){
alert(this.name+"A foodie."); } var wangcai =new Dog(); wangcai.eat(); 6. Create in a hybrid wayfunction Car(name,price){
this.name=name;
this.price=price;
}
Car.prototype.sell=function(){
alert("I am"+this.name+"I'm selling it now."+this.price+"Ten thousand dollars");
}
var camry =new Car(Camry27); camry.sell();Copy the code###Javascript scope domain? Global functions cannot view the internal details of local functions, but local functions can view the function details on top of them, up to the global details. When you need to find a property or method from a local function, if the current scope is not found, the search will be traced back to the upper scope, all the way to the global function, this organization is the scope chain.
### Talk about understanding This object.
- This always refers to the direct (not indirect) caller of the function;
- If we have the new keyword, this refers to the object that came out of new;
- In an event, this points to the object that triggered the event. In particular, this in an attachEvent in IE always points to the global object Window;
What does ### Eval do? Its function is to parse the corresponding string into JS code and run; Eval should be avoided as it is unsafe and very performance-intensive (2 times, once parsed into JS and once executed). Var obj =eval(‘(‘+ STR +’)’); var obj =eval(‘(‘+ STR +’)’);
- What is a Window object? What is a Document object? [BOM] is the browser window object model, and the top-level object is the Window
Window and document are both instance objects, they belong to Object, you can’t call them in new, you have to call their methods and properties directly
The Window object has seven properties:
DefauleStatus: specifies the information in the status bar of a window.
Status: Specifies the information in the status bar of the current window.
Frames: Is an array containing all the frames in the window.
Parent: indicates the parent window of the current window.
Self: indicates the current window.
Top: indicates the top window of all current Windows.
Window: indicates the current window.
The Window object has five methods:
Alert: Displays a dialog box with an OK button.
Confirm: Displays a dialog box with the OK and Cancel buttons.
Prompt: Displays a dialog box with an input area.
Open: Opens a new window.
Close: closes the user window.
###null = undefined
Null indicates that an object is defined and has a "null value"; Undefined means the value does not exist. typeof undefined //"undefined"Undefined: is a representation"No"The original value or representation of theta"Missing value", is that there should be a value here, but it is not defined yet. Return undefined when attempting to read; For example, if a variable is declared but not assigned, undefined typeof null //"object"Null: is an object (empty object, without any properties or methods); For example, as a parameter of a function, the parameter of the function is not an object. Note: use === when validating null, because == cannot separate null and undefined. A: yes! Q: Does Zhang SAN have a house? A: No! Undefined Q: Is there such a person as Joe? A: No!Copy the code## write a generic event listener function
// readyEvent after the page is loaded:function(fn) {
if (fn==null) {
fn=document;
}
var oldonload = window.onload;
if(typeof window.onload ! ='function') {
window.onload = fn;
} else {
window.onload = function() { oldonload(); fn(); }; }}, / / sight, respectively dom0 | | dom2 | | IE way to bind the event / / parameters: the elements of the operation, the name of the event, the event handler addEvent:function(element, type, handler) {
if(Element.addeventListener) {// Event type, function to execute, whether to catch Element.addeventListener (type, handler, false);
} else if (element.attachEvent) {
element.attachEvent('on' + type.function() {
handler.call(element);
});
} else {
element['on' + type] = handler; }}, // removeEvent removeEvent:function(element, type, handler) {
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else if (element.datachEvent) {
element.detachEvent('on' + type, handler);
} else {
element['on' + type] = null; }}, // Stop events (mainly event bubbles, because IE does not support event capture)function(ev) {
if (ev.stopPropagation) {
ev.stopPropagation();
} else {
ev.cancelBubble = true; }}, // Cancel the event's default preventDefault:function(event) {
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false; }}, // get the event target getTarget:function(event) {
returnevent.target || event.srcElement; }, // Get a reference to the event object, get all the information about the event, ensure that the event is always available; getEvent :function(e) {
var ev = e || window.event;
if(! ev) { var c = this.getEvent.caller;while (c) {
ev = c.arguments[0];
if (ev && Event == ev.constructor) {
break; } c = c.caller; }}returnev; }};Copy the code###[“1”, “2”, “3”].map(parseInt)
[1, NaN, NaN] Because parseInt takes two arguments (val, radix), where radix denotes the radix used for parsing. Map passed 3 elements (Element, index, array), and the corresponding radix was illegal, resulting in the failure of parsing.Copy the code### event is? What’s the difference between IE and Firefox’s event mechanism? How do I stop bubbling?
1. An action we take in a web page (some actions correspond to multiple events). For example, when we click a button an event is generated. Is behavior that can be detected by JavaScript. 2. Event handling mechanism: IE is event bubbling, Firefox supports two event models at the same time, that is: capture event and bubbling event; 3. ev.stopPropagation(); (Old IE method ev.cancelBubble =true;)Copy the code### What is a closure and why use it?
A closure is a function that has the right to access variables in the scope of another function. The most common way to create a closure is to create another function within a function and access local variables of this function through another function. Closures can be used to break through the scope domain and pass variables and methods inside the function to the outside. Closures have the following features: 1. Functions are nested within functions. 2. <ul> <li> index = 0</li> <li> index = 1</li> <li> index = 2</li> <li> <li> index = 3</li> </ul> <scripttype="text/javascript">
var nodes = document.getElementsByTagName("li");
for(i = 0; i<nodes.length; i+= 1){ nodes[i].onclick =function(){ console.log(i+1); // If no closure is used, the value is 4}(I); } </script> After say667() is executed, the say667() closure internal variables will exist, and the internal variables of the closure internal functions will not exist so that Javascript's garbage collection mechanism will not reclaim say667() resources Since say667() 's internal function is executed depending on the variables in Say667 (), this is a pretty straightforward description of what closures dofunction say667() {
// Local variable that ends up within closure
var num = 666;
var sayAlert = function() {
alert(num);
}
num++;
returnsayAlert; } var sayAlert = say667(); SayAlert ()// Execution result should pop 667Copy the code### “use strict” in javascript code; What does that mean? What’s the difference in using it?
Use Strict is a strict mode added to ECMAscript 5. This mode makes Javascript run under stricter conditions, makes JS coding more standardized, eliminates some unreasonable and loose aspects of Javascript syntax, and reduces some weird behavior. Bad features that are supported by default are disabled, such as the inability to use with and the inability to assign values to global variables in unexpected circumstances. Functions must be declared at the top level. Functions are not allowed to be declared in non-function code blocks. Arguments. callee is not allowed to be used. Eliminate some unsafe aspects of code execution, keep code execution safe, limit function changes, strict modeevalFunctions also behave differently from non-strict modes; Improve the efficiency of the compiler, increase the running speed; Pave the way for future standardization of new versions of Javascript.Copy the codeHow to determine if an object belongs to a class?
Using Instanceof (to be perfected)if(a instanceof Person){
alert('yes');
}
Copy the codeWhat exactly does the ###new operator do?
1. Create an empty object that is referenced by this and inherits the prototype of the function. Properties and methods are added to the object referenced by this. 3. The newly created object is referenced by this and returns this implicitly. var obj = {}; obj.__proto__ = Base.prototype; Base.call(obj);Copy the codeHave you done anything with native JavaScript?
.Copy the codeIn Javascript, there is a function that performs object lookup and never looks up the prototype. What is this function?
The hasOwnProperty function in javaScript returns a Boolean value indicating whether an object has an attribute with the specified name. This method cannot check whether the property is present in the stereotype chain of the object; The property must be a member of the object itself. HasOwnProperty (proName) The object parameter is mandatory. An instance of an object. ProName is mandatory. The string value of an attribute name. The hasOwnProperty function method in JavaScript returns if the object has an attribute with the specified nametrueOtherwise, returnfalse.Copy the code###JSON
JSON(JavaScript Object Notation) is a lightweight data interchange format. It is based on a subset of JavaScript. The data format is simple, easy to read and write, and occupies little bandwidth, such as: {"age":"12"."name":"back"} JSON string to JSON object: var obj =eval('('+ str +') '); var obj = str.parseJSON(); var obj = JSON.parse(str); JSON object toJSONString: var last= obj.tojsonstring (); var last=JSON.stringify(obj);Copy the code###[].forEach.call(? (” “), function (a) {a.s tyle. Outline = “1 px solid #” + (~ ~ (math.h random 1 < < () (24))). Tostring (16)}) < code = “” > could you explain what the meaning of this code?
What are the ways to lazily load js?
Defer and Async, create the DOM dynamically (most used), and load JS asynchronously on demandCopy the codeWhat is ###Ajax? How do I create an Ajax?
Asynchronous Javascript And XML. Asynchronous transfer + JS + XML. The so-called asynchronous, simply explained here is: when sending a request to the server, we do not have to wait for the result, but can do other things at the same time, until the result itself will follow up according to the Settings, at the same time, the page is not the whole page refresh, improve the user experience. (1) Create an XMLHttpRequest object, that is, create an asynchronous call object (2) create a new HTTP request and specify the method, URL, and validation information for the HTTP request (3) set up a function that responds to changes in the status of the HTTP request (4) send the HTTP request (5) Get the data returned by the asynchronous call (6) Use JavaScript and DOM to achieve local refreshCopy the code### The difference between synchronous and asynchronous?
The concept of synchronization probably comes from the concept of synchronization in the OS, where different processes are prioritized (by blocking, waking up, etc.) in order to do something together. Synchronization emphasizes orderliness. There is no such ordering in asynchrony. Synchronization: When the browser requests the server, the user sees the page refresh and sends the request again. After the request is complete, the page is refreshed and the user sees the new content and performs the next operation. Asynchronous: The browser requests from the server. The user performs normal operations and the browser requests from the back end. When the request is finished, the page is not refreshed, the new content will also appear, and the user will see the new content. (To be perfected)Copy the codeHow to solve cross-domain problems?
Jsonp, iframe, window.name, window.postMessage, server set proxy pageCopy the codeWhat if the page encoding is inconsistent with the requested resource encoding? How to do ### Modular development? Execute the function immediately without exposing private members
var module1 = (function(){
var _count = 0;
var m1 = function() {/ /... }; var m2 =function() {/ /... };return{ m1 : m1, m2 : m2 }; }) (); (to be continued)Copy the code###AMD (Modules/Asynchronous-Definition), CMD (Common Module Definition) The AMD specification is here: github.com/amdjs/amdjs… The CMD specification is here: github.com/seajs/seajs…
Asynchronous Module Definition, all modules will be loaded asynchronously, does not affect subsequent statements. All statements that depend on some module are placed in the callback function. Differences: 1. For dependent modules, AMD is early execution, CMD is delayed execution. Since 2.0, however, RequireJS has also been deferred (handled differently depending on how it is written). CMD advocates as lazy as possible. 2. CMD advocates as lazy as possible. // CMD define(function(require, exports, module) {
var a = require('./a') a.dosomething () var b = require()'./b') // the dependency can be written nearby b.dosomething () //... }) // AMD default recommended define(['./a'.'./b'].function(a, b) {// dependencies must start with a.dosomething () // 100 lines omitted here b.dosomething () //... })Copy the code-
What is the core principle of requireJS? How does it load dynamically? How to avoid multiple loads? How is it cached?
-
What do you know about ECMAScript6?
-
“ECMAScript6” ECMAScript6 “ECMAScript6”
What are the ways to load JS asynchronously?
(1) defer, which only supports IE (2) Async: (3) create script, insert it into DOM, and callBack after loadingCopy the code### Documen. write vs. innerHTML
Document.write can only redraw the entire pageCopy the code###DOM manipulation – How to add, remove, move, copy, create, and find nodes?
Create a new node createDocumentFragment() // Create a DOM fragment createElement() // create a specific element createTextNode() // Create a text node (2) Add, remove, replace, insert AppendChild () removeChild() replaceChild() insertBefore() // Insert a new child before the existing one (3) find getElementsByTagName() // through the tag name GetElementsByName () // getElementById() // Unique by element IDCopy the code### the difference between.call() and.apply()?
Call (sub,3,1) == add(3,1); alert(4); Note: functions in js are actually objects, and Function names are references to Function objects.function add(a,b)
{
alert(a+b);
}
functionsub(a,b) { alert(a-b); } the add. Call (sub, 3, 1);Copy the code-
What are the native methods for arrays and objects?
-
JS how to implement a class. How do I instantiate this class
-
Scope and variable declaration enhancement in JavaScript?
-
How to write high-performance Javascript?
-
Which operations cause memory leaks?
-
Have you seen the JQuery source code? Can you give a brief overview of how it works?
-
What object does this refer to as returned by the init method of jquery.fn? Why return this?
-
How to convert an array to a JSON string in jquery, and then back again?
-
What is the principle of jQuery property copy (extend), how to achieve deep copy?
-
What is the difference between jquery.extend and jquery.fn.extend?
-
How are jQuery queues implemented? Where can queues be used?
-
What are the differences between bind(),live(),delegate() and on() in Jquery?
-
How is it possible to bind multiple events to a JQuery object at the same time?
-
Whether you know about custom events. What is the fire function in jQuery and when to use it?
-
In what way is jQuery combined with the Sizzle selector? (jquery.fn.find () to enter the Sizzle)
-
How to optimize jQuery performance?
What is the difference between Jquery and Jquery UI?
JQuery is a js library that provides functions such as selectors, property modification, event binding, etc. **jQuery UI is a plug-in designed on the basis of jQuery and using the extensibility of jQuery. Provides some common interface elements, such as dialog boxes, drag behavior, resizing behavior, and so onCopy the code###JQuery Can you briefly explain how it works?
.Copy the codeHow to convert an array to a JSON string and back? JQuery does not provide this functionality, so you need to write two jQuery extensions first:
$.fn.stringifyArray = function(array) {
return JSON.stringify(array)
}
$.fn.parseArray = function(array) {
returnJson.parse (array)} then call: $("").stringifyArray(array)
Copy the codeWhat is the difference between jQuery and Zepto? What are their usage scenarios?
.Copy the code### how to optimize jQuery?
* The performance of class-based selectivity is expensive compared to Id selectors because you need to traverse all DOM elements. * Frequently manipulated DOM is cached before manipulation. It is better to use Jquery's chain call. Var STR =$();"a").attr("href");
*for (var i = size; i < arr.length; i++) {}
forEach loop looks for the.length property of the array (arR). Setting a variable to store this number at the beginning of the loop can make the loop run faster:for (var i = size, length = arr.length; i < length; i++) {}
Copy the codeHow to solve ###Zepto penetration problem?
.Copy the code### How can jQueryUI customize components?
.Copy the codeRequirements: Implement a site that does not refresh the entire page and responds correctly when the browser moves forward and backward. Give your technical implementation plan?
.Copy the codeCollected on the network to be continued……