当前位置: 首页 > article >正文

前端面试题-JS(四)

46 谈谈你对ES6的理解

  • 新增模板字符串(为 JavaScript 提供了简单的字符串插值功能)
  • 箭头函数
  • for-of (⽤来遍历数据—例如数组中的值。)
  • arguments 对象可被不定参数和默认参数完美代替。
  • ES6 将p romise 对象纳⼊规范,提供了原⽣的 Promise 对象。
  • 增加了 let 和 const 命令,⽤来声明变量。
  • 增加了块级作⽤域。
  • let 命令实际上就增加了块级作⽤域。
  • 还有就是引⼊ module 模块的概念

47 ECMAScript6 怎么写class么

  • 这个语法糖可以让有 OOP 基础的⼈更快上⼿ js ,⾄少是⼀个官⽅的实现了
  • 但对熟悉 js 的⼈来说,这个东⻄没啥⼤影响;⼀个 Object.creat() 搞定继承,⽐class 简洁清晰的多

48 什么是⾯向对象编程及⾯向过程编程,它们的异同和优缺点

  • ⾯向过程就是分析出解决问题所需要的步骤,然后⽤函数把这些步骤⼀步⼀步实现,使⽤的时候⼀个⼀个依次调⽤就可以了
  • ⾯向对象是把构成问题事务分解成各个对象,建⽴对象的⽬的不是为了完成⼀个步骤,⽽是为了描叙某个事物在整个解决问题的步骤中的⾏为
  • ⾯向对象是以功能来划分问题,⽽不是步骤

49 ⾯向对象编程思想

  • 基本思想是使⽤对象,类,继承,封装等基本概念来进⾏程序设计
  • 优点
    • 易维护
      • 采⽤⾯向对象思想设计的结构,可读性⾼,由于继承的存在,即使改变需求,那么维护也只是在局部模块,所以维护起来是⾮常⽅便和较低成本的
    • 易扩展
    • 开发⼯作的重⽤性、继承性⾼,降低重复⼯作量。
    • 缩短了开发周期

50 对web标准、可⽤性、可访问性的理解

  • 可⽤性(Usability):产品是否容易上⼿,⽤户能否完成任务,效率如何,以及这过程中⽤户的主观感受可好,是从⽤户的⻆度来看产品的质量。可⽤性好意味着产品质量⾼,是企业的核⼼竞争⼒
  • 可访问性(Accessibility):Web内容对于残障⽤户的可阅读和可理解性
  • 可维护性(Maintainability):⼀般包含两个层次,⼀是当系统出现问题时,快速定位并解决问题的成本,成本低则可维护性好。⼆是代码是否容易被⼈理解,是否容易修改和增强功能。

51 如何通过JS判断⼀个数组

  • instanceof ⽅法
    • instanceof 运算符是⽤来测试⼀个对象是否在其原型链原型构造函数的属性
var arr = [];
arr instanceof Array; // true
  • constructor ⽅法
    • constructor 属性返回对创建此对象的数组函数的引⽤,就是返回对象相对应的构造函数
var arr = [];
arr.constructor == Array; //true
  • 最简单的⽅法

  • 这种写法,是 jQuery 正在使⽤的

Object.prototype.toString.call(value) == '[object Array]'
// 利⽤这个⽅法,可以写⼀个返回数据类型的⽅法
var isType = function (obj) {
return Object.prototype.toString.call(obj).slice(8,-1);
}
  • ES5 新增⽅法 isArray()

var a = new Array(123);
var b = new Date();
console.log(Array.isArray(a)); //true
console.log(Array.isArray(b)); //false

52 谈⼀谈let与var的区别

  • let 命令不存在变量提升,如果在 let 前使⽤,会导致报错
  • 如果块区中存在 let 和 const 命令,就会形成封闭作⽤域
  • 不允许重复声明,因此,不能在函数内部重新声明参数

53 map与forEach的区别

  • forEach ⽅法,是最基本的⽅法,就是遍历与循环,默认有3个传参:分别是遍历的数组内容 item 、数组索引 index 、和当前遍历数组 Array
  • map ⽅法,基本⽤法与 forEach ⼀致,但是不同的,它会返回⼀个新的数组,所以在callback需要有 return 值,如果没有,会返回 undefined

54 谈⼀谈你理解的函数式编程

  • 简单说,“函数式编程"是⼀种"编程范式”(programming paradigm),也就是如何编写程序的⽅法论
  • 它具有以下特性:闭包和⾼阶函数、惰性计算、递归、函数是"第⼀等公⺠"、只⽤"表达式"

55 谈⼀谈箭头函数与普通函数的区别?

  • 函数体内的 this 对象,就是定义时所在的对象,⽽不是使⽤时所在的对象
  • 不可以当作构造函数,也就是说,不可以使⽤ new 命令,否则会抛出⼀个错误
  • 不可以使⽤ arguments 对象,该对象在函数体内不存在。如果要⽤,可以⽤ Rest 参数代替
  • 不可以使⽤ yield 命令,因此箭头函数不能⽤作 Generator 函数

56 谈⼀谈函数中this的指向

  • this的指向在函数定义的时候是确定不了的,只有函数执⾏的时候才能确定this到底指向谁,实际上this的最终指向的是那个调⽤它的对象

  • 《javascript语⾔精髓》中⼤概概括了4种调⽤⽅式:

  • ⽅法调⽤模式

  • 函数调⽤模式

  • 构造器调⽤模式
    graph LR
    A–>B

  • apply/call调⽤模式

57 异步编程的实现⽅式

  • 回调函数
    • 优点:简单、容易理解
    • 缺点:不利于维护,代码耦合⾼
  • 事件监听(采⽤时间驱动模式,取决于某个事件是否发⽣):
    • 优点:容易理解,可以绑定多个事件,每个事件可以指定多个回调函数
    • 缺点:事件驱动型,流程不够清晰
  • 发布/订阅(观察者模式)
    • 类似于事件监听,但是可以通过‘消息中⼼ʼ,了解现在有多少发布者,多少订阅者
  • Promise对象
    • 优点:可以利⽤then⽅法,进⾏链式写法;可以书写错误时的回调函数;
    • 缺点:编写和理解,相对⽐较难
  • Generator函数
    • 优点:函数体内外的数据交换、错误处理机制
    • 缺点:流程管理不⽅便
  • async函数
    • 优点:内置执⾏器、更好的语义、更⼴的适⽤性、返回的是Promise、结构清晰。
    • 缺点:错误处理机制

58 对原⽣Javascript了解程度

  • 数据类型、运算、对象、Function、继承、闭包、作⽤域、原型链、事件、 RegExp 、JSON 、 Ajax 、 DOM 、 BOM 、内存泄漏、跨域、异步装载、模板引擎、前端 MVC 、路由、模块化、 Canvas 、 ECMAScript

59 Js动画与CSS动画区别及相应实现

  • CSS3 的动画的优点
    • 在性能上会稍微好⼀些,浏览器会对 CSS3 的动画做⼀些优化
    • 代码相对简单
  • 缺点
    • 在动画控制上不够灵活
    • 兼容性不好
  • JavaScript 的动画正好弥补了这两个缺点,控制能⼒很强,可以单帧的控制、变换,同时写得好完全可以兼容 IE6 ,并且功能强⼤。对于⼀些复杂控制的动画,使⽤javascript 会⽐较靠谱。⽽在实现⼀些⼩的交互动效的时候,就多考虑考虑 CSS 吧

60 JS 数组和对象的遍历⽅式,以及⼏种⽅式的⽐较

  • 通常我们会⽤循环的⽅式来遍历数组。但是循环是 导致js 性能问题的原因之⼀。⼀般我们会采⽤下⼏种⽅式来进⾏数组的遍历
  • for in 循环
  • for 循环
  • forEach
    • 这⾥的 forEach 回调中两个参数分别为 value , index
    • forEach ⽆法遍历对象
    • IE不⽀持该⽅法; Firefox 和 chrome ⽀持
    • forEach ⽆法使⽤ break , continue 跳出循环,且使⽤ return 是跳过本次循环
  • 这两种⽅法应该⾮常常⻅且使⽤很频繁。但实际上,这两种⽅法都存在性能问题
  • 在⽅式⼀中, for-in 需要分析出 array 的每个属性,这个操作性能开销很⼤。⽤在key 已知的数组上是⾮常不划算的。所以尽量不要⽤ for-in ,除⾮你不清楚要处理哪些属性,例如 JSON 对象这样的情况
  • 在⽅式2中,循环每进⾏⼀次,就要检查⼀下数组⻓度。读取属性(数组⻓度)要⽐读局部变量慢,尤其是当 array ⾥存放的都是 DOM 元素,因为每次读取都会扫描⼀遍⻚⾯上的选择器相关元素,速度会⼤⼤降低

61 gulp是什么

  • gulp 是前端开发过程中⼀种基于流的代码构建⼯具,是⾃动化项⽬的构建利器;它不仅能对⽹站资源进⾏优化,⽽且在开发过程中很多重复的任务能够使⽤正确的⼯具⾃动完成
  • Gulp的核⼼概念:流
  • 流,简单来说就是建⽴在⾯向对象基础上的⼀种抽象的处理数据的⼯具。在流中,定义了
    ⼀些处理数据的基本操作,如读取数据,写⼊数据等,程序员是对流进⾏所有操作的,⽽
    不⽤关⼼流的另⼀头数据的真正流向
  • gulp正是通过流和代码优于配置的策略来尽量简化任务编写的⼯作
  • Gulp的特点:
    • 易于使⽤:通过代码优于配置的策略,gulp 让简单的任务简单,复杂的任务可管理
    • 构建快速 利⽤ Node.js 流的威⼒,你可以快速构建项⽬并减少频繁的 IO 操作
    • 易于学习 通过最少的 API ,掌握 gulp 毫不费⼒,构建⼯作尽在掌握:如同⼀系列流管道

62 说⼀下Vue的双向绑定数据的原理

  • vue.js 则是采⽤数据劫持结合发布者-订阅者模式的⽅式,通过Object.defineProperty() 来劫持各个属性的 setter , getter ,在数据变动时发布消息给订阅者,触发相应的监听回调

63 事件的各个阶段

  • 1:捕获阶段 —> 2:⽬标阶段 —> 3:冒泡阶段
  • document —> target ⽬标 ----> document
  • 由此, addEventListener 的第三个参数设置为 true 和 false 的区别已经⾮常清晰了
    • true 表示该元素在事件的“捕获阶段”(由外往内传递时)响应事件
    • false 表示该元素在事件的“冒泡阶段”(由内向外传递时)响应事件

64 let var const

let

  • 允许你声明⼀个作⽤域被限制在块级中的变量、语句或者表达式
  • let绑定不受变量提升的约束,这意味着let声明不会被提升到当前
  • 该变量处于从块开始到初始化处理的“暂存死区”

var

  • 声明变量的作⽤域限制在其声明位置的上下⽂中,⽽⾮声明变量总是全局的
  • 由于变量声明(以及其他声明)总是在任意代码执⾏之前处理的,所以在代码中的任意位置声明变量总是等效于在代码开头声明

const

  • 声明创建⼀个值的只读引⽤ (即指针)
  • 基本数据当值发⽣改变时,那么其对应的指针也将发⽣改变,故造成 const 申明基本数据类型时
  • 再将其值改变时,将会造成报错, 例如 const a = 3 ; a = 5 时 将会报错
  • 但是如果是复合类型时,如果只改变复合类型的其中某个 Value 项时, 将还是正常使⽤

65 快速的让⼀个数组乱序

requestAnimationFrame 来每 16 ms 刷新⼀次
var arr = [1,2,3,4,5,6,7,8,9,10];
arr.sort(function(){
return Math.random() - 0.5;
})
console.log(arr);

http://www.kler.cn/a/37513.html

相关文章:

  • Python(十)变量
  • 【AIGC】AIGC程序记录
  • 为了实现上网自由,我做了一个多功能串口服务器
  • ElasticSearch入门教程--集群搭建和版本比较
  • 100种思维模型之路径依赖思维模型-98
  • 人工智能(pytorch)搭建模型18-含有注意力机制的CoAtNet模型的搭建,加载数据进行模型训练
  • nginx路由
  • 计算机网络 day7 扫描IP脚本 - 路由器 - ping某网址的过程
  • git下载源码及环境搭建下载源码之后端(一)
  • 一道北大强基题背后的故事(七)——特征根公式的来龙去脉
  • Spring - 更简单的获取 Bean 对象
  • Android 四大布局使用详解
  • transformer 学习
  • Filebeat+ELK (grok、mutate、mutiline、date)详解
  • 数据结构与算法——什么是线性表(线性存储结构)
  • NVIDIA Deep Learning Accelerator (DLA) 支持的几种张量格式
  • 3ds Max 无插件制作燃烧的火焰动画特效
  • 直方图 直方图均衡化
  • VScode 终端无法识别npm以及Missing script: “serve“ 问题
  • SpringBoot第22讲:SpringBoot如何实现接口限流之分布式