【面试宝典】每天5道题,温故而知新

面试宝典.jpeg

本系列文章针对目前常见的面试题,仅提供了相应的核心原理及思路,部分边界细节未处理。后续会持续更新,希望对你有所帮助。

这是今天的题目,你可以先思考一下,然后重点关注不熟悉的~
  • JS中基本数据类型有哪几种?基本数据和复杂数据类型有什么区别?

  • JavaScript中什么是闭包?写出一个例子

  • 如何正确判断this的指向?(注意区分严格模式和非严格模式)?

  • 说一下对call、apply、bind三个函数的认识?自己实现一下bind方法

  • JavaScript实现一个继承方法

逐个击破

1.JS中数据类型有哪几种?有什么区别?

最新的 ECMAScript 标准定义了 7 种数据类型:

  • 简单(基本)数据类型 Undefined、Null、Boolean、Number、String、 Symbol类型(ES6新增)

  • 复杂数据类型:Object

注意一下两种特殊类型:
  • Unndefined类型:该类型只有一个值,即特殊的undefined。在使用var声明变量但未对其加以初始化时,这个变量的值就是undefined。无论在什么情况下都没有必要把一个变量的值显式地设置为undefined。
  • Null类型:该类型同样只有一个值,即null。从逻辑角度来看,null表示一个空指针对象,而这也正式使用typeof操作符检测null值时会返回object的原因。事实上,undefined值是派生自null值的。
基本数据和复杂数据类型的区别
  • 基本类型值:指的是保存在栈内存中的简单数据段;
  • 引用类型值(复杂数据):指的是那些保存在堆内存中的对象,意思是,变量中保存的实际上只是一个指针,这个指针指向内存堆中实际的值;
两种访问方式的区别
  • 基本类型值:按值访问,操作的是他们实际保存的值;
  • 引用类型值:按引用访问,当查询时,我们需要先从栈中读取内存地址,然后再顺藤摸瓜地找到保存在堆内存中的值;


    栈和堆.jpeg
两种类型复制的区别
  • 基本类型变量的复制:
    从一个变量向一个变量复制时,会在栈中创建一个新值,然后把值复制到为新变量分配的位置上,改变源数据不会影响到新的变量(互不干涉);

  • 引用类型变量的复制:
    复制的是存储在栈中的指针,将指针复制到栈中为新变量分配的空间中,而这个指针副本和原指针执行存储在堆中的同一个对象,复制操作结束后,两个变量实际上将引用同一个对象;因此改变其中的一个,将影响另一个;

2.JavaScript中什么是闭包?写出一个例子?

闭包就是定义在函数内部,能够读取其他函数内部变量的函数。

举例:用闭包实现一个计数器

function createCounter() {
        let counter = 0;
        return function () {
            counter = counter + 1;
            return counter
        };
    }
    const increment = createCounter();
    const c1 = increment();
    const c2 = increment();
    const c3 = increment();
    console.log('example increment', c1, c2, c3);//1,2,3

闭包的用途:

  • 可以读取函数内部的变量,

  • 让这些变量的值始终保持在内存中。

使用闭包注意点

  • 由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大

  • 闭包会在父函数外部,注意不能随便改变父函数内部变量的值

还有疑问的话可以查看我这篇文章【JS基础系列】带你深入理解闭包

3.如何正确判断this的指向(注意区分严格模式和非严格模式)?

this的指向总共可以分为五种:

  • 默认绑定(非严格模式-window,严格模式-undefined)
  • 隐式绑定(一般是上下文,特殊情况指向window或者undefined)
  • 显式绑定(指向绑定的对象,特殊情况指向window或者undefined)
  • new绑定(一般指向新对象,但是返回function或object时,指向返回的对象)
  • 箭头函数绑定(指向上下文中的this)

还有疑问的话可以查看我这篇文章【JS基础系列】如何正确判断this的指向?

4.说一下对call、apply、bind三个区别?自己实现一下bind方法

在JS中,call、apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向。

call、apply、bind方法的共同点和区别:

  • 三者都是用来改变函数的this对象的指向的;
  • 三者第一个参数都是this要指向的对象,也就是想指定的上下文(函数的每次调用都会拥有一个特殊值——本次调用的上下文(context)——这就是this关键字的值。);
  • 三者都可以利用后续参数传参;
  • bind 是返回对应函数,便于稍后调用;apply 、call 则是立即调用 。
  • apply、call 二者而言,作用完全一样,只是接受参数的方式不太一样。
var func = function(arg1, arg2) {};
func.call(this, arg1, arg2);
func.apply(this, [arg1, arg2])
func.bind(this, arg1, arg2)()

其中 this 是你想指定的上下文,他可以是任何一个 JavaScript 对象(JavaScript 中一切皆对象),call 需要把参数按顺序传递进去,而 apply 则是把参数放在数组里。

下面自己实现一个bind方法:

Function.prototype.bind2 = function (context) {
    if (typeof this !== "function") {
      throw new Error("Function.prototype.bind - what is trying to be bound is not callable");
    }
    var self = this;
    var args = Array.prototype.slice.call(arguments, 1);
    var fNOP = function () {};
    var fBound = function () {
        var bindArgs = Array.prototype.slice.call(arguments);
        return self.apply(this instanceof fNOP ? this : context, args.concat(bindArgs));
    }
    fNOP.prototype = this.prototype;
    fBound.prototype = new fNOP();
    return fBound;
}

还有疑问的话可以查看我这篇文章【JS基础系列】bind方法的模拟实现

5.js实现一个继承方法

// 借用构造函数继承实例属性
function Child () {
  Parent.call(this)
}
// 寄生继承原型属性
(function () {
  let Super = function () {}
  Super.prototype = Parent.prototype
  Child.prototype = new Super()
})()

恭喜你,又掌握了一个新技能~

喜欢就点个关注吧~❤️

关注微信公众号【前端FE】了解更多哦~

公众号:【前端FE】.PNG

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,185评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,445评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,684评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,564评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,681评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,874评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,025评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,761评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,217评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,545评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,694评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,351评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,988评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,778评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,007评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,427评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,580评论 2 349

推荐阅读更多精彩内容

  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,106评论 0 21
  • 函数和对象 1、函数 1.1 函数概述 函数对于任何一门语言来说都是核心的概念。通过函数可以封装任意多条语句,而且...
    道无虚阅读 4,550评论 0 5
  • JavaScript语言精粹 前言 约定:=> 表示参考相关文章或书籍; JS是JavaScript的缩写。 本书...
    微笑的AK47阅读 578评论 0 3
  • 函数只定义一次,但可能被执行或调用任意次。JS函数是参数化的,函数的定义会包括一个称为形参的标识符列表,这些参数在...
    PySong阅读 519评论 0 0
  • 函数只定义一次,但可能被执行或调用任意次。JS函数是参数化的,函数的定义会包括一个称为形参的标识符列表,这些参数在...
    PySong阅读 311评论 0 0