Web front-end entry to actual combat: 32 common js interview questions

JS interview questions:

[Click here to receive interview questions information]

1. What data types are returned by typeof of javascript

string, boolean,number, undefined, function,object

2. mentioned three kinds of casts and two kinds of implicit type conversion?
Mandatory ( parseInt, parseFloat, number) implicit ( == === + -)

3. The difference between split() and join()
split() is to cut the string into an array, which join()is to convert the array into a string.

4. Array methods pop(), push(), unshift(), shift()

  • push()Add at the end
  • pop()Tail delete
  • unshift()Head add
  • shift()Header deletion

5. What are the compatible writing methods under IE and standards

var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target

6. The difference between get and post when ajax request

  • getIt is urlback poston the virtual carrier inside
  • get There is a size limit (only a few parameters can be submitted)
  • postThan getsecurity
  • Different applications, request data and submit data

7.call 和 apply 的区别
Object.call(this, obj1, obj2, obj3) Object.apply(this, arguments)

applyAnd callonly difference is that different parameters of the second transfer mode, applya second parameter must be an array, and callallowed to pass a list of parameters.

8. How to parse json data when ajax request is
usedJSON.parse

9. What is the event delegation?
Use the principle of event bubbling to let your own triggered events be executed by their parent elements instead!

10. What is a closure, what are its characteristics, and what impact it has on the page. A
closure is a function that can read the internal variables of other functions, so that the function is not recycled by the GC mechanism. If the closure is used too much, it is easy to cause memory leaks.

Why are you closing the portal

11. How to stop the event from bubbling up

  • ie: stop bubbling ev.cancelBubble = true;
  • Non-IE ev.stopPropagation();

12. How to block default events

  • 1.return false
  • 2.ev.preventDefault();

13. Add, delete, replace and insert into a contact method
1. Create a new node

// 创建一个具体的元素
createElement();
// 创建一个文本节点
createTextNode();

2. Add, remove, replace, insert

appendChild();  //添加
removeChild();  //移除
replaceChild(); //替换
insertBefore(); //插入

3. Find

//通过标签名称
getElementsByTagName();
//通过元素的Name属性的值
getElementsByName();
//通过元素Id,唯一性
getElementById();    

14. Explain the principle of jsonp and why it is not a real ajax to
dynamically create scripttags and callback functions

AjaxIs the page no refresh request data operation

15.The difference between document load and document ready is
document.onload that jsit is executed only after the structure and style, the exterior and the image are loaded.js

document.readyA domtree has been created on the implementation of the method, this method is not native, jquerythere$().ready(function)

16.”"with"=" The difference
== will automatically convert the type, and then judge whether it is equal, it
===will not automatically convert the type, just go to the comparison

17. What is the difference between function declaration and function expression?
In Javscript, the parser does not treat function declarations and function expressions equally when loading data into the execution environment. The parser will read the function declaration first and make it available (accessible) before executing any code. As for Function expressions must wait until the parser executes to the line of code where it is located before they are actually parsed and executed.

18. For the understanding of scope context and this, look at the following code:

var User = {
    
    
 count: 1,
 getCount: function() {
    
    
  return this.count;
 }
};
console.log(User.getCount()); // 1
var func = User.getCount;
console.log(func()); // 是1和undefined

`func`是在`window`的上下文中被执行的,所以不会访问到`count`属性。

19. Look at the following code and give the output result.

for(var i = 1; i <= 3; i++){
    
      //建议使用let 可正常输出i的值
  setTimeout(function(){
    
    
    console.log(i);   
  },0); 
};
4 4 4// 原因:Javascript事件处理器在线程空闲之前不会运行。

20. When a DOM node is clicked, we want to be able to execute a function, what should we do?

box.onlick= function(){
    
    }
box.addEventListener("click",function(){
    
    },false);
<button οnclick="box()"></button>

21. What is Javascript's event flow model? The
“事件冒泡”: event starts to be received by the most specific element, and then the
“事件捕捉”:event is propagated up level by level. The event is received by the least specific node first, and then level by level down, until the most specific
“DOM事件流”:three stages: Event capture, target stage, event bubbling

22. Look at the following code, what is the output? Explain the reason.

var a = null;
alert(typeof a);
// object

Explanation: This JavaScripthas been the case since its inception. It nullis a data type with only one value, and this value is null. Represents a null pointer object, so the typeoftest will return ”object”.

23. Determine the string to start with a letter, followed by numbers, underscores, letters, and the length is 6-30

var reg=/^[a-zA-Z]\w{5,29}$/;

24. Answer the following code, what is the value of alert?

    var a = 100;  
    function test() {
    
      
        alert(a);  
        a = 10;  //去掉了var 就变成定义了全局变量了
        alert(a);  
    }  
    test();
    alert(a);
// 正确答案是:100, 10, 10

25. What is the difference between the two variable ranges of javaScript?

  • Global variables: valid in the current page
  • Local variables: valid within the function method

26. The difference between null and undefined?
nullIt is an object that represents "none", which is converted to a numeric value 0; it undefinedis an original value that represents "none", which is converted to a numeric value NaN. When the declared variable has not been initialized, the default value of the variable undefined. nullUsed to indicate objects that do not yet exist

undefinedIndicates "missing value", that is, there should be a value here, but it is not yet defined. Typical usage is:

1. When the variable is declared, but is not assigned, it is equal to undefined.
2. When calling the function, the parameter that should be provided is not provided, and the parameter is equal to undefined.
3. The object has no attribute assigned, and the value of the attribute is undefined.
4. When the function does not return a value, it returns by default undefined.

nullMeans "no object", that is, there should be no value there. Typical usage is:
1. As a parameter of a function, it means that the parameter of the function is not an object.
2. As the end of the object prototype chain.

27. What exactly does the new operator do?
1. Create an empty object, and the this variable refers to the object, and also inherits the function prototype.
2. Properties and methods are added to the object referenced by this.
3. The newly created object is referenced by this, and finally returns this implicitly.

What are the ways to delay loading in 28.js?

  • deferwithasync
  • Dynamically created DOM(create mode script, inserted into DOMthe middle, loaded callBack)
  • Load js asynchronously on demand

29. How to choose between the advantages and disadvantages of Flash and Ajax in use?

Flash ajax comparison

1. It is Flashsuitable for processing multimedia, vector graphics, and accessing machines; CSSit is not easy to be searched because of insufficient text processing.
2. ajaxYes CSS, text support is very good, support search; multimedia, vector graphics, machine access is insufficient.
Common points: non-refresh delivery of messages with the server, user offline and online status, operation of the DOM

30. Do not use loops, create an array of length 100, and the value of each element is equal to its subscript.

new Array(100).fill(0).map((_, c) => c)

31 How do I want to get all the checkboxes on the page? (Does not use third-party frameworks)

var inputs = document.getElementsByTagName("input"); // 获取所有的input标签对象
var checkboxArray = []; // 初始化空数组,用来存放checkbox对象。
for(var i=0;i<inputs.length;i++){
    
    
  var obj = inputs[i];
  if(obj.type=='checkbox'){
    
    
     checkboxArray.push(obj);
  }
}

32. Write a function to clear the spaces before and after the string. (Compatible with all browsers)

String.prototype.trim= function(){
    
    
    return this.replace(/^\s+/,"").replace(/\s+$/,"");
}

Guess you like

Origin blog.csdn.net/weixin_56134381/article/details/115330236