>웹 프론트엔드 >JS 튜토리얼 >50개의 JavaScript 인터뷰 및 답변(컬렉션)

50개의 JavaScript 인터뷰 및 답변(컬렉션)

青灯夜游
青灯夜游앞으로
2019-11-26 15:52:1917514검색

50개의 JavaScript 인터뷰 및 답변(컬렉션)

질문 1: Java와 JavaScript의 차이점은 무엇입니까?

Java JavaScript
Java는 OOP 프로그래밍 언어입니다. JavaScript는 OOP 스크립트 언어입니다.
가상 머신이나 브라우저에서 실행되는 애플리케이션을 생성합니다. 코드는 브라우저나 노드 환경에서 실행됩니다.
컴파일하려면 Java 코드가 필요합니다. JS 코드는 모두 텍스트 형식입니다.

질문 2: Javascript란 무엇입니까?

JavaScript는 정적 HTML 페이지에 대화형 기능을 구축할 수 있는 객체 지향 기능을 갖춘 경량 해석 프로그래밍 언어입니다. 언어의 공통 핵심은 Netscape, Internet Explorer 및 기타 웹 브라우저에 내장되어 있습니다.

관련 기사 추천: 2020년 js 인터뷰 질문의 가장 완벽한 모음(최신)

질문 3: JS는 어떤 데이터 유형을 지원하나요?

50개의 JavaScript 인터뷰 및 답변(컬렉션)

데이터

다음은 JS의 특징입니다:

 ● JS는 가볍고 해석되는 프로그래밍 언어입니다.

● 웹 중심 애플리케이션 제작을 위해 설계되었습니다.

 ● Java 보완 및 통합

● HTML 보완 및 통합

● 개방형 및 크로스 플랫폼

질문 5: JavaScript는 대소문자를 구분합니다

50개의 JavaScript 인터뷰 및 답변(컬렉션)

예, JS는 대소문자를 구분하는 언어입니다. 키워드, 변수, 함수 이름 및 기타 식별자는 항상 일관된 대문자와 함께 사용해야 합니다.

질문 6: JS의 장점은 무엇입니까?

JS 사용의 다음 장점:

 ● 서버 상호 작용 감소

- 페이지를 서버에 보내기 전에 사용자 입력을 확인할 수 있어 서버 트래픽이 절약됩니다. 즉, 서버 부하가 줄어듭니다. ● 즉각적인 피드백 - 사용자는 무언가를 입력하는 것을 잊었는지 확인하기 위해 페이지가 다시 로드될 때까지 기다릴 필요가 없습니다. ● 향상된 상호 작용 - 사용자가 마우스로 가리키거나 키보드를 통해 활성화할 때 반응하는 인터페이스입니다.

● 풍부한 인터페이스 - JS를 사용하여 드래그 앤 드롭 구성 요소와 슬라이더를 포함하여 웹 사이트에 풍부한 인터페이스를 제공할 수 있습니다.

질문 7: JS로 객체를 생성하는 방법

JS는 객체 개념을 지원하므로 다음과 같은 방법으로 객체를 생성할 수 있습니다.

var emp = {
name: "Daniel",
age: 23
};

질문 8: JS로 배열을 생성하는 방법

JS는 배열을 생성할 수도 있습니다. 매우 간단합니다:

var x = [];
var y = [1, 2, 3, 4, 5];

질문 9: JS의 명명된 함수는 무엇이며 정의하는 방법: 명명된 함수는 정의된 직후에 이름을 선언하며 다음과 같이 정의할 수 있습니다. function 키워드를 사용하여 정의됨:

function named(){
// write code here
}

질문 10: 익명 함수를 변수에 할당하고 이를 다른 함수에 매개 변수로 전달할 수 있습니까? 예. 익명 함수는 변수에 할당될 수 있으며, 다른 함수에 매개변수로 전달될 수도 있습니다.

질문 11: JS의 매개변수 개체는 무엇이며 함수에 전달된 매개변수 유형을 가져오는 방법 JS 변수 arguments는 함수에 전달된 매개변수를 나타냅니다. typeof 연산자를 사용하면 함수에 전달된 매개변수 유형을 얻을 수 있습니다. 다음과 같습니다:

function func(x){
console.log(typeof x, arguments.length);
}
func(); //==> "undefined", 0
func(7); //==> "number", 1
func("1", "2", "3"); //==> "string", 3

function关键字定义:

document.cookie = "key1 = value1; key2 = value2; expires = date";

问题10:是否可以将匿名函数分配给变量并将其作为参数传递给另一个函数

可以。一个匿名函数可以分配给一个变量,它也可以作为参数传递给另一个函数。

问题11:JS中的参数对象是什么&如何获得传递给函数的参数类型

JS 变量arguments表示传递给函数的参数。 使用typeof运算符,可以获得传递给函数的参数类型。如下:

...
<input>
...

问题12:JS中变量的作用域是什么

变量的作用域是程序中定义它的区域,JS变量只有两个作用域:

 ● 全局变量 - 全局变量具有全局作用域,这意味着它在JS代码中的任何位置都可见。

 ● 局部变量 - 局部变量仅在定义它的函数中可见,函数参数始终是该函数的本地参数。

问题13:JS 中“this”运算符的用途是什么?

this

질문 12: JS에서 변수의 범위는 무엇입니까

변수의 범위는 프로그램에서 변수가 정의된 영역입니다.

● 전역 변수

- 전역 변수는 전역 범위를 가지며 이는 JS 코드의 어느 곳에서나 볼 수 있음을 의미합니다.

 ● 지역 변수 - 지역 변수는 정의된 함수에서만 볼 수 있으며, 함수 매개변수는 항상 해당 함수에 대한 지역 매개변수입니다.

질문 13: JS에서 "🎜🎜this" 연산자의 목적은 무엇인가요? 🎜🎜🎜🎜 this 키워드는 자신이 속한 개체를 나타냅니다. 어디에 쓰이느냐에 따라 가치가 달라집니다. 메서드에서 this는 소유자 개체를 참조하고, 함수에서는 전역 개체를 참조합니다. 🎜🎜🎜🎜 질문 14: 콜백이란 무엇입니까? 🎜🎜🎜🎜 콜백 함수는 매개변수나 옵션으로 메서드에 전달되는 일반 JS 함수입니다. 다른 함수의 실행이 완료된 후에 실행되는 함수이므로 콜백이라고 합니다. JS에서 함수는 객체이므로 함수는 함수를 매개변수로 받아들일 수 있고 다른 함수에 의해 반환될 수 있습니다. 🎜🎜🎜🎜질문 15: 폐쇄란 무엇인가요? 예를 들어보세요 🎜🎜🎜

A closure는 현재 범위 외부에 정의된 변수가 일부 내부 범위 내에서 액세스될 때마다 생성됩니다. 내부 함수에서 외부 함수의 범위에 액세스할 수 있습니다. JS에서는 함수가 생성될 때마다 클로저가 생성됩니다. 클로저를 사용하려면 다른 함수 내에 함수를 정의하고 노출하면 됩니다.

질문 16: 일부 내장 메소드와 이들이 반환하는 값을 나열하세요.

내장 메소드 반환값
CharAt() 지정된 인덱스의 문자를 반환합니다.
Concat() 두 개 이상의 문자열을 연결합니다.
forEach() 배열의 각 요소에 대해 함수를 호출합니다.
indexOf() 지정된 값이 처음 발생할 때 호출하는 문자열 개체의 인덱스를 반환합니다.
pop() 배열에서 마지막 요소를 제거하고 해당 요소를 반환합니다.
push() 배열 끝에 하나 이상의 요소를 추가하고 배열의 새 길이를 반환합니다.
reverse() 배열 요소의 순서를 반대로 바꿉니다.

问题17: JS中的变量命名约定是什么?

在JS中命名变量时要遵循以下规则:

  1. 咱们不应该使用任何JS保留关键字作为变量名。例如,breakboolean变量名无效。
  2. JS 变量名不应该以数字(0-9)开头。它们必须以字母或下划线开头。例如,123name是一个无效的变量名,但123namename123是一个有效的变量名。
  3. JS 变量名区分大小写。例如,Testtest是两个不同的变量。

问题18:TypeOf 运算符是如何工作的

typeof运算符用于获取其操作数的数据类型。 操作数可以是文字或数据结构,例如变量,函数或对象。 它是一个一元运算符,放在它的单个操作数之前,可以是任何类型。 它的值是一个字符串,表示操作数的数据类型。

问题19:如何使用 JS 创建 cookie

创建cookie的最简单方法是为document.cookie对象分配一个字符串值,如下所示:

document.cookie = "key1 = value1; key2 = value2; expires = date";

问题20:如何使用JS读取cookie

读取cookie就像写入cookie一样简单,因为document.cookie对象的值是cookie

 ● document.cookie的值是由分号分隔的name=value对的列表,其中name是cookie的名称,value是其字符串值。

 ● 可以使用split()方法将字符串分解为键和值。

问题21:如何使用 JS 删除 cookie

如果要删除cookie以便后续尝试读取cookie,则只需将过期日期设置为过去的时间。 咱们应该定义cookie路径以确保删除正确的cookie。 如果未指定路径,某些浏览器将不允许咱们删除cookie

问题22:Attribute 和Property之间有什么区别

 ● Attribute——提供关于元素的更多细节,如id、类型、值等。

 ● Property —— 分配给属性的值,如type =“text”value ='Name'等。

问题23:列出在JS代码中访问HTML元素的不同方式

下面是在JS代码中访问 html 元素的方法列表:

 ● getElementById(‘idname’): 按id名称获取元素

 ● getElementsByClass(‘classname’): 获取具有给定类名的所有元素

 ● getElementsByTagName(‘tagname’): 获取具有给定标记名称的所有元素

 ● querySelector(): 此函数采用css样式选择器并返回第一个选定元素

问题24:JS代码在HTML文件中可以以多少种方式使用

主要有三种:

 ● 行内

 ● 内部

 ● 外部

行内方式:

...
<input>
...

内部方式:

nbsp;html>


<meta>
<script>
//声明一个函数(整个文档都可以使用)
function surprise() {
alert('恭喜你中了一百万')/*弹出框*/
}
</script>

。。。

外部方式:

...
<!--很多html页面都可以调用js4.js页面-->
<script>
...</script>

问题25:在JS中定义变量的方法有哪些

在 JS 中声明变量有三种方式:

 ● varvar 语句用于声明一个变量,咱们可以选择初始化该变量的值。例子:var a =10;变量声明在代码执行之前处理。

 ● const - 常量的值不能通过重新赋值来改变,并且不能重新声明。

 ● let - 语句声明一个块级作用域的本地变量,并且可选的将其初始化为一个值。

问题26:什么是类型化语言

类型化语言中,值与值关联,而不是与变量关联,它有两种类型:

  • 动态:在这种情况下,变量可以包含多种类型,如在JS中,变量可以取number, string 类型。
  • 静态:在这种情况下,变量只能包含一种类型,就像在Java中声明为string的变量只能包含一组字符,不能包含其他类型。

问题27:Cookie 与 Local storage 与 Session storage 区别

Features Cookie localStorage sessionStorage
데이터 수명 은 일반적으로 서버에 의해 생성되며 만료 시간을 설정할 수 있습니다. 브라우저 측에서 쿠키가 생성되면 기본적으로 브라우저를 닫은 후 만료됩니다 삭제하지 않으면 영구적으로 저장됩니다 현재 세션에서만 유효하며 페이지나 브라우저를 닫으면 지워집니다
저장된 데이터 크기 약 4K 일반적으로 5MB
서버측과 통신 쿠키를 사용하여 너무 많은 데이터를 저장하면 성능이 저하됩니다. 문제 클라이언트(예: 브라우저)에서만 저장, 서버와의 통신에 참여하지 않음
사용 용이성 프로그래머가 직접 캡슐화해야 함, Yuansheng의 쿠키 인터페이스는 친숙하지 않음 프로그래머가 캡슐화해야 함 자체적으로 Yuansheng의 쿠키 인터페이스는 친숙하지 않습니다. Yuansheng 인터페이스는 허용 가능하며 객체 및 배열에 대한 더 나은 지원을 위해 다시 캡슐화될 수도 있습니다

问题28:  ‘==‘ 和 ‘===‘ 区别

==: 两边值类型不同的时候,要先进行类型转换,再比较。
===:不做类型转换,类型不同的一定不等。

一言以蔽之:==先转换类型再比较,===先判断类型,如果不是同一类型直接为false

问题29:null 和 undefined 区别

undefined是基本数据类型 表示未定义 缺少的意思。

null是引用数据类型,是对象,表示空对象

undefined是从null派生出来的  所以undefined==nulltrue

问题 30:undeclared 和 undefined 区别?

undeclared的变量是程序中不存在且未声明的变量。 如果程序尝试读取未声明变量的值,则会遇到运行时错误。undefined的变量是在程序中声明但未赋予任何值的变量,如果程序试图读取未定义变量的值,则返回undefined的值。

问题 31: 列出一些JS框架

50개의 JavaScript 인터뷰 및 답변(컬렉션)

JS框架是用JavaScript编写的应用程序框架,它与控制流中的JS库不同,一些最常用的框架是:

 ● Vue

 ● Angular

 ● React

问题 32: window 与 document 的区别:

window:JS 的 window 是一个全局对象,它包含变量、函数、historylocation

document:document也位于window之下,可以视为window的属性。

问题 33: innerHTML 和 innerText 的区别

innerHTML:也就是从对象的起始位置到终止位置的全部内容,包括Html标签。

innerText:从起始位置到终止位置的内容, 但它去除Html标签

问题 34:JS中的事件冒泡是什么

事件冒泡是HTML DOM API中事件传播的一种方式,当一个事件发生在另一个元素中的一个元素中,并且两个元素都注册了该事件的句柄时。通过冒泡,事件首先由最内部的元素捕获和处理,然后传播到外部元素。执行从该事件开始,并转到其父元素。然后执行传递给父元素,以此类推,直到body元素。

问题 35:NaN 是什么

NaN 即非数值(Not a Number),NaN 属性用于引用特殊的非数字值,该属性指定的并不是不合法的数字。

NaN 属性 与 Number.Nan 属性相同。

提示: 请使用 isNaN() 来判断一个值是否是数字。原因是 NaN 与所有值都不相等,包括它自己。

问题 36:JS的原始/对象类型如何在函数中传递?

两者之间的一个区别是,原始数据类型是通过值传递的,对象是通过引用传递的。

 ● 值传递:意味着创建原始文件的副本。把它想象成一对双胞胎:他们出生的时候一模一样,但是双胞胎中的老大在战争中失去了一条腿,而老二却没有。

 ● 引用传递: 意味着创建原始文件的别名。当我妈妈叫沙雕的时候,虽然我的名字叫小智,但这并不是说我就突然就克隆了一个自己:我仍然是我,只是可以用不同名字来称呼我而已。

问题 37:如何在JS中将任意基的字符串转换为整数

parseInt(string, radix)   将一个字符串 string 转换为 radix 进制的整数, radix 为介于2-36之间的数,如下:

parseInt("4F", 16)

问题 38:2+5+ '3'的结果是什么

由于25是整数,它们将以数字形式相加。因为3是一个字符串,它将与 7 拼接,结果是73。

问题 39:export 和 import 是什么

importexport有助于咱们编写模块化JS代码。 使用importexport,咱们可以将代码拆分为多个文件,如下:

//------ lib.js ------
export const sqrt = Math.sqrt;
export function square(x) {
return x * x;
}
export function diag(x, y) {
return sqrt(square(x) + square(y));
}
 
//------ main.js ------
 { square, diag } from 'lib';
console.log(square(5)); // 25
console.log(diag(4, 3)); // 5

问题40:JS中的“严格”模式是什么以及如何启用?

严格模式是在代码中引入更好的错误检查的一种方法。

 ● 当使用严格模式时,不能使用隐式声明的变量,或为只读属性赋值,或向不可扩展的对象添加属性。

 ● 可以通过在文件,程序或函数的开头添加“use strict”来启用严格模式

问题41:JS 中的 prompt 框是什么

提示框是允许用户通过提供文本框输入输入的框。 prompt() 方法显示一个对话框,提示访问者输入。 如果您希望用户在输入页面之前输入值,则通常会使用提示框。 弹出提示框时,用户必须在输入输入值后单击“确定”或“取消”才能继续。

问题42:下面代码的输出是什么?

var Y = 1;
if (eval(function f(){}))
{
  y += typeof F;
}
console.log(y);

打印1undefinedif条件语句使用eval求值,因此eval(function f(){})返回函数f(){}(为真)。因此,在if语句中,执行typeof f返回undefined,因为if语句代码在运行时执行,而if条件中的语句在运行时计算。

问题43:call 和 apply有什么区别

callapply可以用来重新定义函数的执行环境,也就是this的指向;callapply都是为了改变某个函数运行时的context,即上下文而存在的,换句话说,就是为了改变函数体内部this的指向。

call()调用一个对象的方法,用另一个对象替换当前对象,可以继承另外一个对象的属性,它的语法是:

Function.call(obj[, param1[, param2[, [,...paramN]]]]);

说明:call方法可以用来代替另一个对象调用一个方法,call方法可以将一个函数的对象上下文从初始的上下文改变为obj指定的新对象,如果没有提供obj参数,那么Global对象被用于obj

apply()call()方法一样,只是参数列表不同,语法:

Function.apply(obj[, argArray]);

说明:如果argArray不是一个有效数组或不是arguments对象,那么将导致一个TypeError,如果没有提供argArrayobj任何一个参数,那么Global对象将用作obj。

问题44:如何在JS中清空数组

有许多方法可以用来清空数组:

方法一:

arrayList = []

上面的代码将把变量arrayList设置为一个新的空数组。如果在其他任何地方都没有对原始数组arrayList的引用,则建议这样做,因为它实际上会创建一个新的空数组。咱们应该小心使用这种清空数组的方法,因为如果你从另一个变量引用了这个数组,那么原始的引用数组将保持不变。

方法二:

arrayList.length = 0;

上面的代码将通过将其length设置为0来清除现有数组。这种清空数组的方式还会更新指向原始数组的所有引用变量。 因此,当你想要更新指向arrayList的所有引用变量时,此方法很有用。

方法三:

arrayList.splice(0, arrayList.length);

这处方法也行,当然这种清空数组的方法也将更新对原始数组的所有引用。

方法四:

while(arrayList.length)
{
  arrayList.pop();
}

上面的实现也可以空数组,但通常不建议经常使用这种方式。

问题45:以下代码的输出什么

var output = (function(x)
{
  delete x;
  return x;
}
)(0);
console.log(output);

打印 0delete操作符用于从对象中删除属性。这里x不是一个对象,而是一个局部变量,删除操作符不影响局部变量。

问题46:以下代码的输出什么

var X = { foo : 1}; 
var output = (function() 
{ 
  delete X.foo; 
  return X.foo; 
} 
)(); 
console.log(output);

输出 undefineddelete操作符用于删除对象的属性。X是一个具有foo属性的对象,由于它是一个自调用函数,所以咱们将从对象X中删除foo属性。这样做之后,当咱们试图引用一个被删除的foo属性时,结果是undefined

问题47:以下代码的输出什么

var foo = function Bar()
{
  return 7;
};
typeof Bar();

输出将是引用错误。函数定义只能有一个引用变量作为其函数名。

问题49:为什么要将JS源文件的全部内容包装在一个函数中

这是一种越来越普遍的做法,被许多流行的JS库所采用。 这种技术围绕文件的整个内容创建一个闭包,最重要的是,它可以创建一个私有命名空间,从而有助于避免不同JS模块和库之间潜在的名称冲突。

该技术的另一个特性是允许为全局变量提供一个简单的别名,这在jQuery插件中经常使用。

问题50:JS中的转义字符是什么

JS转义字符使咱们能够在不破坏应用程序的情况下编写特殊字符。转义字符(\)用于处理特殊字符,如单引号、双引号、撇号和&号,在字符前放置反斜杠使其显示。

如:document.write("I am a \"good\" boy")

原文:https://hackr.io/blog/javascript-interview-questions

为了保证的可读性,本文采用意译而非直译。

相关学习推荐:javascript视频教程

위 내용은 50개의 JavaScript 인터뷰 및 답변(컬렉션)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 segmentfault.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제