Последний письменный тест Nioke по интерфейсу JS, 100 вопросов

Мало знаний, большой вызов! Эта статья участвует в "Необходимые знания для программистов«Творческая деятельность

Эта статья участвовала в "Проект «Звезда раскопок»”, чтобы выиграть творческий подарочный пакет и бросить вызов творческим поощрительным деньгам.

предисловие

Через некоторые тематические порталы:Резюме последних предварительных вопросов интервью Ниуке (включая анализ)

Несколько дней назад в свободное время я взял последние письменные тестовые вопросы и вопросы интервью Ниуке, Я хотел сделать некоторую статистику, с нетерпением ждать обычных тестовых сайтов и популярных тестовых сайтов JavaScript в интервью и направлять свое будущее исследование.

Но когда я был готов проанализировать данные после статистики, я обнаружил, что: я не мог найти особенно хорошую отправную точку для анализа, и я мог думать только об использовании круговых диаграмм и гистограмм, чтобы показать частоту каждого типа вопросов или полигон Провал моей последней статьи послужил огромным предзнаменованием.

Подробная статья:Получите последние предварительные вопросы интервью Niuke и 500 горячих точек интервью JS для анализа данных.

Хотя статья отвечает кому-то еще, я также чувствую себя немного поражению, но я думаю, что эта статья не является местом, еще несколько очков. Благодаря простым статистикам и анализе данных, мы также можем собирать вещи от нее, такие как три основных взрыва: JavaScript более глубокий, обещание, ручной разорванный код и т. Д.

Благодаря этой статье я также получил много комментариев: всеобщий интерес к теме очень высок. Поэтому я быстро взбиваю, я наконец закончил тему раздела темы пентеста, я надеюсь помочь большим людям, которым нужно взять интервью.

Без лишних слов давайте окунемся в море вопросов.

большой выбор

Основы JS

js концепция и определение типа

1. Разве следующее не является возвращаемым значением оператора TypeOf?

A. "string"
B. "function"
C. "object"
D. "null"

2. Выполните следующий код, результат вывода ошибки

A. 输入：typeof {"x":1} 输出："object" 
B. 输入：typeof 1 输出："number" 
C. 输入：typeof [{x:1}] 输出："array" 
D. 输入：typeof NaN 输出："number"

3. Основные типы, о которых можно судить по typeof:

A. undefined
B. null
C. array
D. object

4. Следующие типы данных не являются примитивными типами данных JavaScript:

A. Boolean
B. undefined
C. Symbol
D. Array

5. Какое из следующих утверждений о типах данных в JavaScript неверно ()

A. 数据类型分为基本数据类型和引用数据类型
B. JavaScript一共有8种数据类型
C. Object是引用数据类型，且只存储于堆(heap)中
D. BigInt是可以表示任意精度整数的基本数据类型，存储于栈(stack)中

Отвечать

DCADC

логическое суждение

1. Выберите выражение, результат которого верен?

A. null instanceof Object
B. null === undefined
C. null == undefined
D. NaN == NaN

2. Какой из следующих результатов кода верен?

A. Symbol.for('a') === Symbol.for('a')
B. Symbol('a') === Symbol('a')
C. NaN === NaN
D. {} === {}

3. Какое из следующих выражений возвращает истину на основе следующих переменных?

var a = 1;
var b = [];
var c = '';
var d = true;

A. (a || b) === true
B. (b && c) === true
C. (c && d) === true
D. (d || a) === true

4. Возвращаемое значение 1==true равно true. Правильно ли это предложение?

A. T
B. F

5. Какой из следующих кодов выводит true?

A. console.log([] === []);
B. console.log(undefined == 0);
C. console.log(undefined == false);
D. console.log(false == '');

6. В среде браузера верен следующий результат печати

A. console.log("12" === 12)
B. console.log (NaN === NaN)
C. console.log (typeof(null) === typeof(window))
D. console.log ([1,2,3] === [1,2,3])

Обратите внимание на разницу между средой браузера и средой узла, например параметр C.

7. Следующие выражения верны

A. Number('a') == Number('a')
B. -1 == true
C. 3 + '2' === 5
D. ![] == ''

Отвечать

CADADCD

Math

1. Как округлить 7,25 до ближайшего целого числа

A. Math.round(7.25)
B. Math.ceil(7.25)
C. round(7.25)
D. Math.rnd(7.25)

2. Какой из следующих вариантов может генерировать случайное целое число 0

A. Math.floor(Math.random()*6)
B. Math.floor(Math.random()*10)
C. Math.floor(Math.random()*11)
D. Math.ceil(Math.random()*10)

3. Следующее ( ) выражение генерирует случайное целое число от 0 до 7 (включая 0,7)

A. Math.floor(Math.random()*6)
B. Math.floor(Math.random()*7)
C. Math. floor(Math.random()*8)

Отвечать

A CD(注意D) C

нить

1. Метод split() используется для разделения строки на массив строк.

A. T
B. F

2. Какой метод объекта String находит подстроку и возвращает эту позицию подстроки

A. match()
B. indexOf()
C. search()
D. concat()

Отвечать

A BC

JSON

1. Что из следующего является данными JSON?

A. ｛name:"xiaoming",age,"student"｝
B. ｛"name":"xiaoming","age":"student"｝
C. ｛"xiaoming","student"｝
D. ["xiaoming","student"]

2. Метод JSON.stringify используется ниже, а возвращаемое значение res равно

const fn = function(){}
const res = JSON.stringify(fn)
const num = 123
const res = JSON.stringify(num)
const res = JSON.stringify(NaN)
const b = true
const res = JSON.stringify(b)

A. 'function'、'123'、'NaN'、'true'
B. undefined、'123'、undefined、'true'
C. undefined、'123'、'null'、'true'
D. undefined、'123'、'null'、undefined

Отвечать

BC

множество

1. Метод в массиве js, который не изменяет исходный массив, это ()

A. push
B. concat
C. sort
D. shift

2. Какой из следующих массивов не изменяет сам массив?

A. slice
B. splice
C. sort
D. unshift

3. В JavaScript вам нужно добавить элемент в конец массива Какой из следующих методов следует использовать:

A. push
B. pop
C. shift
D. unshift

4. Элементы, которые нельзя добавить к следующим js-методам управления массивом:

A. push
B. pop
C. unshift
D. splice

5. Какой из следующих методов массива влияет на исходный массив?

A. concat
B. splice
C. slice
D. join

6. Какой из следующих методов массива в JavaScript имеет тип возвращаемого значения, отличный от других

A. concat
B. shift
C. filter
D. map

7. Какой из следующих методов в Array.prototype не изменяет исходный массив?

A. push
B. slice
C. splice
D. sort

8. Для массива nums, состоящего из чисел, теперь необходимо выполнить операцию дедупликации, не меняя nums, и вернуть новый массив без повторяющихся элементов.Следующие фрагменты кода могут завершить эту операцию ()

// (1)
const newNums = Array.from(new Set(nums))

// (2)
const newNums = nums.filter((n, i) => {
    return nums.indexOf(n) === i
})

// (3)
const newNums = nums.forEach((n, i) => {
    return nums.indexOf(n) === i
})

// (4)
const newNums = nums.reduce((acc, n, i) => {
    return [].concat(acc, nums.indexOf(n) === i ? n : []
)
})

A. (1)、(2)、(3)、(4)
B. (1)、(3)、(4)
C. (1)、(2)、(4)
D. (1)、(4)

Отвечать

BAABB
BBC

Обычный

1. Регулярное выражение ^d+[^d]+ соответствует какой из следующих строк?

A. 123
B. 123a
C. d123
D. 123def

2. Что из перечисленного не является методом объекта RegExp

A. test
B. match
C. exec
D. compile

3. Что из следующего удаляет все пробелы в переменной str

A. str.replace(`/\s*/g,""`)
B. str.replace(`/^\s|\s$/g,""`)
C. str.replace(`/^\s*/, ""`)
D. str.replace(`/(\s*$)/g, ""`)

Отвечать

CBA

разное

1. Какая из следующих функций не является глобальной функцией в JavaScript

A. encodeURI
B. parseFloat
C. round
D. eval

2. При написании высокопроизводительного JavaScript следующее описание неверно

A. 遵循严格模式："use strict"
B. 将js脚本放在页面顶部，加快渲染页面
C. 将js脚本成组打包，减少请求，尽量减少使用闭包
D. 使用非阻塞方式下载js脚本，最小化重绘(repaint)和回流(reflow)

3. Что не так с описанием системных методов в JavaScript?

A. parseFloat方法：该方法将一个字符串转换成对应的小数
B. isNaN方法：该方法用于检测参数是否为数值型，如果是，返回true，否则，返回false。
C. escape方法： 该方法返回对一个字符串编码后的结果字符串
D. eval方法：该方法将某个参数字符串作为一个JavaScript执行题

4. Перечисленные ниже браузеры без ядра webkit ()

A. chrome
B. Safari
C. 搜狗浏览器
D. Firefox

5. Какой из следующих кодов может получить дату в виде 2017-08-01 ( )?

// A
var formatDate=getDate()
// B
var formatDate = new Date()
// C
var formatDate = function (date) {
    var y = date.getFullYear();
    var m = date.getMonth() + 1;
    
    var d = date.getDate();
    return y + '-' + m + '-' + d;
};
// D
var formatDate = function (date) {
    var y = date.getFullYear();
    var m = date.getMonth() + 1;
    m = m < 10 ? '0' + m : m;
    var d = date.getDate();
    d = d < 10 ? ('0' + d) : d;
    return y + '-' + m + '-' + d;
};

6. Что из следующего не минимизирует перекраску и переплавку

A. 需要对元素进行复杂的操作时，可以先隐藏(display:"none")，操作完成后再显示
B. 需要创建多个DOM节点时，使用DocumentFragment创建完后一次性的加入document
C. 尽量避免用table布局(table元素一旦触发回流就会导致table里所有的其它元素回流)
D. 尽量不要使用 css 属性简写，如：用border-width, border-style, border-color代替border

Отвечать

CBBDDD

JS в деталях

this

1. Какой из следующих методов не может изменить этот указатель()

A. eval
B. apply
C. bind
D. call

2. В JavaScript следующие параметры верны для этого описания

A. 在使用new实例化对象时, this指向这个实例对象
B. 将对象的方法赋值给变量A。执行A()时 该方法中的this指向这个对象。 
C. 在函数定义时,this指向全局变量
D. 在浏览器下的全局范围内，this指向全局对象

3. Следующее описание методов вызова и применения в JavaScript неверно?

A. call与apply都属于Function.prototype的一个方法，所以每个function实例都有call、apply属性
B. 两者传递的参数不同，call函数第一个参数都是要传入给当前对象的对象，apply不是
C. apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入
D. call传入的则是直接的参数列表。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

Отвечать

AAB

Объем (закрытие)

1. В коде javascript необходимо максимально избегать утечек памяти. Следующие фрагменты кода могут вызвать утечку памяти ()

// (1)
function getName() {
    name = 'javascript'
}
getName()

// (2)
const elements = {
    button: document.getElementById('button')
};
function removeButton() {
    document.body.removeChild(elements.button);
}
removeButton()

// (3)
let timer = setInterval(() => {
    const node = document.querySelector('#node') 
    if(node) {
        clearInterval(timer)
    }
}, 1000);

A. (1)、(2)、(3)
B. (2)、(3)
C. (1)、(3)
D. (1)、(2)

2. Эта операция не приведет к утечке памяти

A. 没有清理的DOM元素引用
B. 被遗忘的定时器
C. 事件侦听没有移除
D. 局部变量不用时，没有设为null

3. Что из перечисленного неверно в отношении замыканий

A. 增加一定的内存消耗
B. 使用不当可能会导致内存泄漏
C. 可以使用闭包模拟私有方法
D. 闭包会改动对象的原型链

Отвечать

DDD

Прототип и наследование

1. Неверный способ реализации наследования в JavaScript:

A. 原型链继承
B. 构造函数继承
C. 组合继承
D. 关联继承

2. Все объекты имеют прототипы

A. T
B. F

3. Какое из следующих утверждений о цепочке прототипов верно:

A. 通过原型链继承的属性和对象自己定义的属性等效
B. 通过原型链可以模拟对象的私有属性
C. 在对象上访问不存在的属性时,会依次遍历整条原型链
D. 所有 JavaScript 中的对象都是位于原型链顶端的 `Object` 的实例

Отвечать

DBC

разное

1. Что из нижеперечисленного не является внешним методом хранения данных?

A. jsonp
B. cookie
C. localStorage
D. sessionStorage

Отвечать

A

ДОМ-вопросы

поток событий

1. Перетащите элемент A в элемент B, какую операцию должен выполнить элемент B ()?

A. event.preventDefault()
B. event.prevent()
C. event.drag()
D. event.drop()

2. Следующие события мыши, которые не поддерживают всплывающую подсказку: ( )?

A. mouseover
B. click
C. mouseleave
D. mousemove

3. В javascript метод, используемый для предотвращения действия по умолчанию для события по умолчанию,

A. stopDeafault()
B. stopPropagation()
C. preventDefault()
D. preventDefaultEven()

4. Каковы три этапа распространения события

目标 -> 捕获 -> 冒泡
冒泡 -> 目标 -> 捕获
目标 -> 冒泡 -> 捕获
捕获 -> 目标 -> 冒泡

5. Что из следующего является неправильным описанием запуска распространенных событий javascript?

A. onchange：用户改变域的内容
B. onkeypress：某个键盘的键被按下或按住
C. onmousedown：某个鼠标按键被按下
D. onblur：元素获得焦点

Отвечать

ACCDD

обход DOM

1. Что из следующего не является attribute() узла поиска DOM?

A. parentObj.firstChild
B. parentObj.children
C. neborNode.previousSibling
D. neborNode.siblings

2. В DOM правильный способ добавления дочернего узла к родительскому узлу — ()?

A. appendChild(parentNode,newNode);
B. append(parentNode,newNode);
C. parentNode.append(newNode);
D. parentNode.appendChild(newNode);

3. Каков тип возвращаемого значения document.getElementById() в JavaScript?

A. Array
B. Object
C. String
D. Function

4. В DOM правильный способ добавления дочернего узла к родительскому узлу — ()?

A. appendChild(parentNode,newNode);
B. append(parentNode,newNode);
C. parentNode.append(newNode);
D. parentNode.appendChild(newNode);

Отвечать

DDBD

разное

1. Изменения следующих свойств элементов DOM, которые вызывают перекомпоновку,

outline
visiblity
font-size
background-color

Отвечать

C

вопросы спецификации

1. В чем смысл setInterval(updateClock,60)()?

A. 每隔60秒调用一次updateClock()
B. 每隔60毫秒调用一次updateClock()
C. 每隔60分钟调用一次updateClock()
D. 每分钟调用60次updateClock()

2. Использование () может получить широту и долготу географического положения?

A. Geolocation.watchPosition()
B. Geolocation.getCurrentPosition()
C. Geolocation.getPosition()
D. Geolocation.Position()

3. setInterval("alert('welcome');",1000); этот код означает

A. 等待1000秒后，再弹出一个对话框
B. 等待1秒钟后弹出一个对话框
C. 每隔一秒钟弹出一个对话框
D. 语句报错,语法有问题

Отвечать

BBC

вопросы ES6

стрелочная функция

1. Следующее описание стрелочной функции js неверно ()

A. 箭头函数没有原型属性
B. 箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值
C. 箭头函数可以作为构造函数，使用new
D. 箭头函数不绑定arguments，取而代之用rest参数解决

2. Одно из следующих утверждений о стрелочных функциях неверно:

A. 函数体内this的指向是定义时所在的对象，而不是使用时所在的对象
B. 箭头函数内不能使用arguments对象
C. 箭头函数不能使用yield命令
D. 可以使用new创建一个箭头函数的实例

Отвечать

CD

promise

1. Что из следующего верно относительно вывода двух фрагментов кода, которые передают Promise.all и Promise.race в пустой массив:

Promise.all([]).then((res) => {
    console.log('all');
});
Promise.race([]).then((res) => {
    console.log('race');
});

A. all 和 race 都会被输出
B. all 和 race 都不会被输出
C. all 会被输出，而 race 不会被输出
D. all 不会被输出，race 会被输出

2. Из следующих сценариев, которые не предназначены для решения ловушки обратного вызова:

A. Promise
B. Generator
C. async
D. Proxy

3. В ECMAScript6 состояния, которые не являются промисами:

A. Pending
B. Pause
C. Fulfilled
D. Rejected

Отвечать

CDB

присваивание деструктуризации

1. Что касается выражений деструктурирования ES6, правильное описание: ()

let [a,b, c,d, e] = "hello"; 

A. e = "hello";
B. 其它都为undefined
C. 当中 a = "h", b = "e";
D. 语法报错

Отвечать

C

большой выбор

Основы JS

1. Какой из следующих методов массива изменит исходный массив

A. push 
B. concat 
C. splice 
D. map

2. Следующий код js, который может объявлять числа,

A. const a = 0xa1
B. const a = 076
C. const a = 0b21
D. const a = 7e2

3. Ниже приведены возвращаемые значения оператора typeof:

(1)function
(2) object
(3) null
(4) array
(5) NaN
(6) bigint
(7) regexp
(8) undefined

A. (1)、(2)、(3)、(4)、(5)、(6)、(7)、(8)
B. (1)、(2)、(3)、(8)
C. (1)、(2)、(8)
D. (1)、(2)、(6)、(8)

4. Результат next() равен строке string

A. typeof 'string'
B. String('string').toString()
C. 'string'.split('').sort().join('')
D. (function(string){return string})('string')
E. JSON.parse('{"string":"string"}').string

5. Какое из следующих уравнений выполняется?

A. parseInt(46.8) `==` parseFloat(46.8)
B. NaN `!==` NaN
C. isNaN('abc') `==` NaN
D. typeof NaN `===` 'number'

6. Какой из следующих вариантов может преобразовать коллекцию A в массив?

A. Array.from(A)
B. [].slice.apply(A)
C. [...A]
D. [].map.call(A, o => o)

7. Следующие результаты возвращают true:

A. null == undefined
B. null === undefined
C. null === null
D. NaN == null
E. NaN === NaN
F. Infinity + 1 !== Infinity

Отвечать

AC ABD D ABDE BD ABCD AC

JS в деталях

1. Какое утверждение верно относительно следующего кода?

function Person() { } var person = new Person();

A. 每一个原型都有一个constructor属性指向关联的构造函数。
B. 每一个对象都有一个prototype属性。
C. Object.getPrototypeOf(person) === Person.prototype
D. person.constructor === Person

2. Что из следующего является микрозадачей в механизме временного цикла JS?

A. process.nextTick
B. promise
C. setTimeout
D. setInterval

Отвечать

ACD AB

ES6

1. Какое из следующих утверждений о let и const верно:

A. let声明的变量值和类型都可以改变
B. const声明的常量不可以改变
C. 两者都不存在变量提升，同时存在暂时性死区，只能在声明的位置后面使用
D. const可以先声明再初始化，可以后赋值

2. Что из следующего верно в отношении промисов (обратите внимание, что «возвращаемый результат» означает успех или неудачу)

A. Promise.all在所有给定的promise都fulfilled后才返回结果
B. Promise.race在给定的promise中，某个fulfilled后才返回结果
C. promise.then的回调函数中，可以返回一个新的promise
D. 对于一个向后台获取数据已经产生结果的promise:p1，再次调用p1.then，不会去重新发起请求获取数据

Отвечать

ABC CD

DOM

1. Какой из следующих кодов является правильным в отношении использования JS для изменения стиля элемента?

document.body.style.['background-color'] = '#fff'
document.body.style.setProperty('background-color', '#fff')
document.body.style = 'background-color': #fff'
document.body.style.fontSize = '14px'

2. Для предотвращения всплытия событий можно использовать следующие методы:

A. event.cancelBubble = true;
B. event.stopPropagation();
C. event.preventDefault();
D. return false;

Отвечать

BCD ABD

заполнить бланк

Определение типа

1. В JavaScript есть var arr = []; результатом typeof arr является
2. Вывод следующего кода с использованием оператора typeof:

var x = typeof x
var res = typeof typeof x;
console.log(x, res)

3. каков результат [typeof null, null instanceof Object]
4. typeof typeof 0
5. Возможный результат оператора typeof JavaScript для массива? объяснить, почему
6. Каков результат следующего кода?

var arr = [];
console.log(typeof arr, Object.prototype.toString.call(arr));

7. console.log(Object.prototype.toString.call(undefined))

преобразование типов

1. Значение выражения "2"+3+4 равно
2. console.log('5' + 3, 5 + '3')
3. var a=parseInt("Офис 111");
4. ["0x1", "0x2", "0x3"].результат map(parseInt)
5. Каков результат выполнения 1+'1' в js?
6. Каков результат выполнения parseInt('77',40) в js?

логическое суждение

1. Пожалуйста, дайте результат запуска кода [5
2. Выражение (2
3. Что выводит console.log(true||false&&false, true&&false||true)?

разное

1. Результатом 1 + - + + + - + 1 является
2. Результатом ['a', ,'b', ,].length является

процедурные вопросы

Основы JS

1. Каковы результаты следующих двух программ?

// case 1
function showCase(value) {
    switch(value) {
    case 'A':
        console.log('Case A');
        break;
    case 'B':
        console.log('Case B');
        break;
    case undefined:
        console.log('Case undefined');
        break;
    default:
        console.log('Case default');
    }
}
showCase(new String('A'));

// case 2
function showCase(value) {
    switch(value) {
    case 'A':
        console.log('Case A');
        break;
    case 'B':
        console.log('Case B');
        break;
    case undefined:
        console.log('Case undefined');
        break;
    default:
        console.log('Case default');
    }
}
showCase(String('A'));

2. Что показывает содержимое тега p?

<html>
    <body>
        <p id="demo"></p>
        <script type="text/javascript">
            var x = 10;
            var y = "10";
            document.getElementById("demo").innerHTML = Boolean(x == y);
        </script>
    </body>
</html>

3. Что будет результатом document.write?

function funcA(x){
    var temp = 4;

    function funcB(y){
        document.write( ++x + y + (temp--));
    }

    funcB(5);
}

funcA(6)

4. Что будет результатом оповещения

var varArr = function(i,j,str) {  
    return j == 0 ? str : varArr(i,--j,(str+= " " + i[j]));
}
var arr = new Array('apple','orange','peach','lime');
var str = varArr(arr,arr.length,"");
alert(str);

5. Что выводит следующая программа?

function greetingMaker(greeting) { 
    function addName(name) {    
        greeting  = greeting.split(' ').reverse().join("-");
        return greeting + " " + name;
    }
    
    return addName;
}

var daytimeGreeting = greetingMaker("Good Day to you");
alert(daytimeGreeting(name)); 

6. Что выводит следующая программа?

String.prototype.GetNum = function() { 
    var regEx = /[^\d]/g; 
    return this.replace(regEx, ''); 
};

var str = "a1b2c3";
str = str.GetNum();
alert(str);

7. Что выводит следующая программа?

function sum(a, b) {
  return a + b;
}
sum(1, "2");

8. Что выводит следующая программа?

var str = "我非常喜欢编程";
str.length = 3;
console.log(str);

9. Что выводит следующая программа?

let number = 0;
console.log(number++);
console.log(++number);
console.log(number);

10. Что выводит следующая программа?

function nums(a, b) {
    if (a > b)
        console.log('a is bigger')
    else 
        console.log('b is bigger')
    return a + b
}
console.log(nums(4, 2))
console.log(nums(1, 2))

11. Что выводит следующая программа?

function side(arr) {
    arr[0] = arr[2];
}
function func1(a, b, c = 3) {
    c = 10;
    side(arguments);
    console.log(a + b + c);
}
function func2(a, b, c) {
    c = 10;
    side(arguments);
    console.log(a + b + c);
}
func1(1, 1, 1);
func2(1, 1, 1);

12. Каков результат следующего кода?

var a = 3;
var b = new Number(3);
var c = 3;

console.log(a == b);
console.log(a === b);
console.log(b === c);

13. После выполнения следующего оператора значение a.length равно ?

var a = [];
a.push(1, 2);
a.shift(3, 4);
a.concat([5, 6]);
a.splice(0, 1, 2);

14. Каков результат следующих фрагментов кода? Почему?

var a = {}, b = '123', c = 123;
a[b] = 'b';
a[c] = 'c';
console.log(a[b]);
// example 2
var a = {}, b = Symbol('123'), c = Symbol('123');
a[b] = 'b';
a[c] = 'c';
console.log(a[b]);
// example 3
var a = {}, b = {key:'123'}, c = {key:'456'};
a[b] = 'b';
a[c] = 'c';
console.log(a[b]);

15. Каково возвращаемое значение каждого из следующих? Почему?

null == undefined
0.1 + 0.2 == 0.3
typeof NaN
typeof Function
typeof Object
typeof {}
'a' + 1
'a' - 1
Function instanceof Object
Object instanceof Function

16. Что выводит следующая программа?

var array = []
for(var i = 0; i < 3; i++) {
    array.push(() => i)
}
var newArray = array.map(el => el())
console.log(newArray)

17. Что выводит следующая программа?

 function a(m, n) {
        var b = function (l) {
            return l <= m ? l * b(l + 1) : 1;
        }

        return b(m - n + 1);
    }

console.log(a(4, 2));

18. Что выводит следующая программа?

console.log(typeof undefined == typeof NULL);
console.log(typeof function () {} == typeof class {});

19. После выполнения значения a и b.age соответственно

var a = 10
var b = {
    age: 11
}
function fn(x,y) {
    --y.age;
    return --x;
}
fn(a,b)

20. Результат выполнения следующей программы:

var number = 4;
var numberFactorial = (function (number){
    return (number === 0)? 1: number* factorial(number-1)
})(number)
console.log(numberFactorial)

21. Вывод следующей программы:

var array = []
for(var i = 0; i < 3; i++) {
    array.push(() => i)
}
var newArray = array.map(el => el())
console.log(newArray)

22. Вывод следующей программы:

function addToList(item, list) {
    return list.push(item)
}
const result = addToList("nowcoder", ["hello"])
console.log(result)

23. Вывод следующей программы:

const first = () => { console.log('first'); return false; }
const second = () => { console.log('second'); return true; }
console.log( first() && second() );
console.log( second() || first() );

24. Вывод следующего кода:

var s='12ab3cd', arr=s.split(/\d/);
console.log(arr[3],arr[4])

25. Вывод следующей программы:

function getAge(...args) {
  console.log(typeof args);
}

getAge(21);

26. Вывод следующей программы:

var arr=[1,2,3];
arr.push(arr.shift())
console.log(arr[1],arr[2])

JS в деталях

это указывает на

Тематический анализ:это указывает на анализ темы и расширение

1. Что выводит следующая программа? Почему?

var x = 1;

var obj = {
    x: 3,
    fun:function () {
        var x = 5;
        return this.x;
    }
};

var fun = obj.fun;
console.log( obj.fun(), fun() );

2. Что выводит следующая программа? Можете ли вы выяснить эту точку тестовой функции?

var a = 5;
 function test() { 
    a = 0; 
    alert(a); 
    alert(this.a); 
    var a;
    alert(a); 
}
new test();

3. Что выводит следующая программа? Почему?

function fun () {
    return () => {
        return () => {
            return () => {
                console.log(this.name)
            }
        }
    }
}
var f = fun.call({name: 'foo'})
var t1 = f.call({name: 'bar'})()()
var t2 = f().call({name: 'baz'})()
var t3 = f()().call({name: 'qux'})

4. Выполните следующий код, что получится на выходе?

let obj1 = {
    a: 1,
    foo: () => {
        console.log(this.a)
    }
}
// log1
obj1.foo()
const obj2 = obj1.foo
// log2
obj2()

5. Что выводит следующая программа? Почему?

const Person = (name="wang",age=10) => {
this.name = name;
this.age = age;
return this.name +' is '+ this.age + 'years old'
}
let result = new Person('zhang',11)
console.log(result)

6. Пожалуйста, опишите результат выполнения и причину следующего кода

var person = {
  age: 18,
  getAge: function() {
    return this.age;
  }
};
var getAge = person.getAge
getAge()

7. Пожалуйста, распечатайте распечатки по порядку и объясните, почему.

var name = 'global';
var obj = {
    name: 'local',
    foo: function(){
        this.name = 'foo';
    }.bind(window)
};
var bar = new obj.foo();
setTimeout(function() {
    console.log(window.name);
}, 0);
console.log(bar.name);
 
var bar3 = bar2 = bar;
bar2.name = 'foo2';
console.log(bar3.name);

8. Результат выполнения следующей программы:

var obj = {
    name:"zhangsan",
    sayName:function(){
        console.info(this.name);
    }
}

var wfunc = obj.sayName;
obj.sayName();
wfunc();
var name = "lisi";
obj.sayName();
wfunc();

9. Вывод следующей программы:

var name='test' 
var a = {    
    name: 'ass',    
    getName: function() {    
        return this.name;   
    } 
} 
var b = a.getName; 
b();

цикл событий

1. Каков результат следующих программ? Почему?

const promiseA = Promise.resolve('a')
promiseA. then((res) => {
    console.log(res)
}).then((res) => {
    console.log(res)
})
const promiseB = Promise.resolve('b')
promiseB. then((res) => {
    console.log(res)
})
promiseB. then((res) => {
    console.log(res)
})

2. Каков результат следующей программы по порядку?

setTimeout(() => {
    console.log(1)
}, 0)

const P = new Promise((resolve, reject) => {
    console.log(2)
    setTimeout(() => {
        resolve()
        console.log(3)
    }, 0)
})

P.then(() => {
    console.log(4)
})
console.log(5)

3. Вывод следующей программы

setTimeout(function(){
    console.log(1);
}, 0)
new Promise(function(resolve){
    console.log(2);
    resolve();
    console.log(3);
}).then(function(){
    console.log(4);
})
console.log(5);

4. Что выводит следующая программа?

(async () => {
    console.log(1);
    setTimeout(() => {
        console.log(2);
}, 0);
await new Promise((resolve, reject) => {
    console.log(3);
}).then(() => {
    console.log(4);
});
    console.log(5);
})();

5. Вывод следующей программы:

new Promise((resolve) => {
    console.log('1')
    resolve()
    console.log('2')
}).then(() => {
    console.log('3')
})
setTimeout(() => {
    console.log('4')
})
console.log('5')

6. Вывод следующей программы:

var p1 = new Promise(function(resolve, reject){
    resolve("2")
})
setTimeout(function(){
    console.log("1")
},10)
p1.then(function(value){
    console.log(value)
})
setTimeout(function(){
    console.log("3")
},0)

7. Вывод следующей программы:

setTimeout(function() {
  console.log('setTimeout');
}, 0);
Promise.resolve().then(function() {
  console.log('promise1');
}).then(function() {
  console.log('promise2');
});

8. Пожалуйста, опишите результат выполнения и причину следующего кода

setTimeout(function() {
    console.log(1)
},0)
new Promise(function executor(resolve){
    console.log(2)
    for (var i = 0; i<10000; i++) {
        i - 9999 && resolve()
    }
    console.log(3)
}).then(function() {
    console.log(4)
})
console.log(5)

9. На веб-странице есть два блока div, код html выглядит следующим образом.

<div class="outer">
 <div class="inner"></div>
</div>

Соответствующий js-код выглядит следующим образом:

var outer = document.querySelector('.outer');
var inner = document.querySelector('.inner');

function onClick() {
    console.log('click');

    setTimeout(function() {
        console.log('timeout');
    }, 0);

    Promise.resolve().then(function() {
        console.log('promise');
    });

    outer.setAttribute('data-random', Math.random());
}

inner.addEventListener('click', onClick);
outer.addEventListener('click', onClick);

Когда щелкнут блок div с внутренним классом, каков результат вывода консоли? 10. Что выводит следующая программа?

(async () => {
    console.log(1);
    setTimeout(() => {
        console.log(2);
}, 0);
await new Promise((resolve, reject) => {
    console.log(3);
}).then(() => {
    console.log(4);
});
    console.log(5);
})();

11. Вывод следующей программы:

setTimeout(() => console.log('a'));
Promise.resolve().then(
   () => console.log('b’);
 ).then(
   () => Promise.resolve('c').then(
     (data) => {
       setTimeout(() => console.log('d'));
       console.log('f');
       return data;
     }
   )
 ).then(data => console.log(data));

12. Вывод следующей программы:

console.log('one'); 
setTimeout(function() { console.log('two'); }, 0); 
Promise.resolve()
       .then(function() { console.log('three'); })
 console.log('four');

13. Результат выполнения следующей программы:

setTimeout(function () {
    console.log(C)
},0)
console.log('D')
new Promise(function(resolve){
    console.log('E')
    resolve()
    console.log('F')
}).then(function() {
    console.log('G')
})
console.log('H')

14. Существует выходная функция, определенная следующим образом:

function log(msg, time) {
  return new Promise((resolve) => {
    setTimeout(() => {
      console.log(msg);
      resolve();
    }, time);
  });
}

Затем вывод следующих трех фрагментов кода:

// 第一段代码：
(async () => {
  for (let i = 0; i < 5; i++) {
    await log(i, 1000);
  }
})();

// 第二段代码：
(async () => {
  [ 1, 2, 3, 4 ].forEach(async (i) => {
    await log(i, 1000);
  });
})();

// 第三段代码：
(async () => {
  for (const i of [ 1, 2, 3, 4 ]) {
    await log(i, 1000);
  }
})();

Прототипы и цепочки прототипов

Портал:Анализ темы прототипа и цепочки прототипов

1. Каков результат следующей программы по порядку?

function Fn1(name) {
    if(name){
    this.name = name;
    }
}
Fn1.prototype.name="jack"
let a = new Fn1();
console.log('a:', a.name);

function Fn2(name) {
    this.name = name;
}
Fn2.prototype.name="jack"
let b = new Fn2();
console.log('b:', b.name);

2. Что выводит следующая программа?

var Foo = (function() {
    var x = 0;
    function Foo() {}
    Foo.prototype.increment = function() {
        ++x;
        console.log(x);
    };
    return Foo;
})();
 
var a = new Foo();
a.increment();
a.increment();
var b = new Foo();
a.increment();

3. Что выводит следующая программа?

var name = 'Jay'
function Person(name){
    this.name = name;
    console.log(this.name)
}
var a = Person('Tom')
console.log(name)
console.log(a)
var b = new Person('Michael')
console.log(b)

4. Пожалуйста, опишите результат выполнения и причину следующего кода

class A{}
class B extends A{}
const a = new A()
const b = new B()
a.__proto__
b.__proto__
B. __proto__
B. prototype.__proto__
b.__proto__.__proto__

5. Пожалуйста, опишите результат выполнения и причину следующего кода

function test() {           
    getName = function() { 
        Promise.resolve().then(() => console.log(0)); 
        console.log(1);               
    };

    return this; 
}
test.getName = function() { 
     setTimeout(() => console.log(2), 0); 
     console.log(3);               
};
test.prototype.getName = function() {    

     console.log(4); 
};       
var getName = function() { 
     console.log(5);             
};
function getName() {

     console.log(6); 
}      
      
test.getName(); 
getName(); 
test().getName(); 
getName();  
new test.getName();
new test().getName();
new new test().getName();

6. Пожалуйста, опишите результат выполнения и причину следующего кода

var tmp = {};
var A = function() {};
A. prototype = tmp;

var a = new A();
A. prototype = {};

var b = Object.create(tmp);
b.constructor = A. constructor;

console.log(a instanceof A);
console.log(b instanceof A);

7. Результат выполнения следующей программы:

function Foo(){}
Foo.prototype.z = 3;
var obj = new Foo();
console.info(obj.z)
obj.z = 10;
console.info(obj.z);
delete obj.z;
console.info(obj.z);

8. Результат выполнения следующей программы:

const Book = {
  price: 32
}
const book = Object.create(Book);
book.type = 'Math';
delete book.price;
delete book.type;
console.log(book.price);
console.log(book.type);

Область видимости и предварительная компиляция

1. Будет ли следующая программа сообщать об ошибке? Если нет, то каковы выходные результаты?

function sayHello() {
    console.log(name);
    console.log(age);
    var name = "Tom";
    let age = 18;
} 
sayHello();

2. Каковы результаты печати следующей программы i?

for (var i = 0; i < 3; i++) {
    setTimeout(_ => {
        console.log(i)
    })
}

for (let i = 0; i < 3; i++) {
    setTimeout(_ => {
        console.log(i)
    })
}

3. Вывод следующей программы:

console.log(a);
var a = 'a';
console.log(b);
let b = 'b';

4. Вывод следующей программы:

var foo = "Hello";
(function(){
    var bar = " World";
    alert(foo + bar);
})();
alert(foo + bar);

5. Вывод следующей программы:

var a = 10;
(function () {
    console.log(a)
    a = 5
    console.log(window.a)
    var a = 20;
    console.log(a)
})()

6. Вывод следующего кода:

const a = 10
function runFunction() {
    const a = 20
    console.log('inside', a)
}
runFunction()
console.log('outside', a)

7. Пожалуйста, опишите распечатку и объясните, почему

"use strict"
var name = 'Jay'
var person = {
    name: 'Wang',
    pro: {
        name: 'Michael',
        getName: function () {
            return this.name
        }
    }
}
console.log(person.pro.getName)
var people = person.pro.getName
console.log(people())

8. Результат следующей программы:

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
</ul>
<script>
var elements = document.getElementsByTagName("li");
for (var i=0;i<elements.length;i++){
    elements[i].onclick =function( ){
    alert(i); 
    };
}

9. Вывод следующей программы

compute(10,100);
var compute = function(A,B) {
    console.info(A * B) ;
};
function compute(A,B){
    console.info(A + B);
}
function compute(A,B){
    console.info((A + B)*2);
}
compute(2,10);

10. Результат выполнения следующей программы:

meili()
function meili() {
    console.log("meili")
}
mogu()
var mogu = function() {
    console.log("mogu")
}

11. В чем разница между выводом следующих двух фрагментов кода? Почему?

// 片段1
check('first');
function check(ars){
    console.log(ars);
}
// 片段2
check('second');
var check= function(ars){
    console.log(ars);
}

ES6

объект

1. Каков результат следующего кода?

const student = {name: 'ZhangSan'}
Object.defineProperty(student, 'age', {value: 22})
console.log(student)
console.log(Object.keys(student))

generator

1. Что выводит следующая программа? Почему?

function * cb(x, y) {
    for(let i = Math.ceil(x); i <= y; i++) {
        yield i;
    }
}

var a = cb(6, 9);
console.log(a.next());
console.log(a.next());

спред оператор

1. Вывод следующей программы:

function fn(...args) {
  console.log(typeof args);
}
fn(21);

promise

Promise.reject(0)
       .catch(e => e)
       .catch(e => console.log(e))

class

1. Пожалуйста, напишите код ES5, сгенерированный после компиляции кода ES6 ниже

class Person {
     constructor (name) {
          this.name = name;
     }
     greet () {
          console.log(`Hi, my name is ${this.name}`);
     }
     greetDelay (time) {
          setTimeout(() => {
               console.log(`Hi, my name is ${this.name}`);
          }, time);
     }
}

Шаблон этикетки

1. Что выводит следующая программа?

function getPersonInfo (one, two, three) {
    console.log(one)
    console.log(two)
    console.log(three)
}
const person = 'Lydia'
const age = 21
getPersonInfo `${person} is ${age} years old`

module

1. Пожалуйста, напишите вывод в индексе

// module.js
export default () => "Hello world"
export const name = "nowcoder"
// index.js
import * as data from "./module"
console.log(data)

2. Есть два файла a.js и b.js, запишите вывод кода в файл b

// a.js
let a = 1
let b = {}
setTimeout(() => {    
a = 2    
b.b = 2
}, 100)
module.exports = { a, b }

// b.js
const a = require('./a')
console.log(a.a)
console.log(a.b)
setTimeout(() => {    
    console.log(a.a)    
    console.log(a.b)
}, 500)

разное

1. Результат:

<div id="box1">
    <div id="box2">
        content
    </div>
</div>
<script>
const $ = document.querySelector.bind(document);
const box1 = $('#box1');
const box2 = $('#box2');

box1.addEventListener('click', () =>{
    console.log('box1 true');
}, true);

box1.addEventListener('click', () =>{
    console.log('box1 false');
}, false);

box2.addEventListener('click', () =>{
    console.log('box2 true');
}, true);

box2.addEventListener('click', () =>{
    console.log('box2 false');
}, false);
</script>

2. Результат:

$(function () { 
    function fn1( value ) {
        alert( value );
    }
    function fn2( value ) {
        fn1("A");
        return false;
    }
    var callbacks = $.Callbacks();
    callbacks.add( fn1 ); 
    callbacks.fire( "B" );
    callbacks.add( fn2 ); 
    callbacks.fire( "C" );
})

3. Какой способ добавить «Hello World!» после элемента p для горизонтальной линии ( )?

<html>
    <head>
        <script type="text/javascript" src="/jquery/jquery.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                $("button").click(function(){
                    $("<b>Hello World!</b>").______("p");
                });
            });
        </script>
    </head>
    <body>
        <p>This is a paragraph.</p>
        <p>This is another paragraph.</p>
        <button>在每个p元素的结尾添加内容</button>
    </body>
</html>

4. Результат:

<div id="box1">
  <div id="box2">
    content
  </div>
</div>
<script>
const $ = document.querySelector.bind(document);
const box1 = $('#box1');
const box2 = $('#box2');
box1.addEventListener('click', () => {
  console.log('box1 true');
}, true);
box1.addEventListener('click', () => {
  console.log('box1 false');
}, false);
box2.addEventListener('click', () => {
  console.log('box2 true');
}, true);
box2.addEventListener('click', () => {
  console.log('box2 false');
}, false);
</script>

5. Пожалуйста, выберите количество раз, когда код ниже выводит 1

var vm = new Vue({  
el: '#example',  
data: {    
    message: 'Hello'  
},  
computed: {    
    test: function () {      
        console.log(1)      
        return this.message    
    }  
},  
created: function (){    
        this.message = 'World'    
        for (var i = 0; i < 5; i++) {        
            console.log(this.test)    
        }  
    }
})

Серия JavaScript для продвинутых пользователей

• JavaScript углубил понимание прототипа и цепочки прототипов.
• Расширенное изучение JavaScript перед компиляцией
• JavaScript Advanced Тщательно проясните эту проблему указывания в JS | «2w Word Big Chapter 38 Вопросы для интервью»
• Глубокое понимание EventLoop для продвинутого JavaScript
• Расширенная область действия JavaScript и цепочка областей видимости

Недавние события

• Используйте анимацию частиц, чтобы запомнить время весеннего фестиваля | Поддержите эмодзи
• Вращай, реагируй! - Танцующие иконки React
• Супердекомпрессия, реализовать универсальный гравитационный и отталкивающий эффект частиц

часть интервью

• Резюме последних предварительных вопросов интервью Ниуке (включая анализ)
• Последний письменный тест Nioke по интерфейсу JS, 100 вопросов
• В 2021 году крупные компании, работающие с клиентами, ответили на эти вопросы, написанные от руки.
• Душевная пытка родного JavaScript (1), сколько вы можете ответить?

счастливое программирование

• CSS реализует свободно летящую птицу 🐦
• Примите кошку для VSCode и веб-сайта