考核题目总结

news2024/9/30 21:15:32

一·JS中的基本类型

有Object, Undefined, Null, Number, String, Symbol, BigInt, Boolean八种

  1. Symbol(ES6新增):Symbol是一种新的原始数据类型,表示独一无二的值。使用Symbol()函数可以创建新的Symbol值,每次调用都会生成一个唯一值。这主要用于创建唯一的属性名,以防止对象属性的冲突。
  2. BigInt(ES2020新增):BigInt类型提供了一种表示大于2^53-1的整数的方法。这些大整数可以用来表示超出Number类型所能表示的数值范围的整数。BigInt使用n后缀的数值字面量(如123n)来定义。

二·闭包

闭包作用:封闭数据,提供操作,外部也可以访问函数内部的变量,可以创建私有变量,避免全局污染。

闭包的应用场景:模拟面向对象的代码风格,封装私有变量,使setTimeout支持传参

function func(param){
    return function(){
        alert(param)
    }
}
var f1 = func(1);
setTimeout(f1,1000);

实现迭代器

function setup(x) {
  var i = 0;
  return function(){
    return x[i++];
  };
}
var next = setup(['a', 'b', 'c']);

//> next();
//"a"
//> next();
//"b"
//> next();
//"c"

闭包的优点:

  1. 可以减少全局变量的定义,避免全局变量的污染
  2. 能够读取函数内部的变量
  3. 在内存中维护一个变量,可以用做缓存

闭包的缺点:

1)造成内存泄露

闭包会使函数中的变量一直保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。【内存泄露:无用的变量一直在内存中,无法被释放】

解决方法——使用完变量后,手动将它赋值为null;

2)闭包可能在父函数外部,改变父函数内部变量的值。

3)造成性能损失

由于闭包涉及跨作用域的访问,所以会导致性能损失。

三·ES6新增语法

  1. let和const

  2. 数据类型symbol

  3. 模板字符串、

  4. 解构表达式

  5. 箭头函数

  6. 模块化

  7. 展开运算符

四·事件循环

事件循环又叫做消息循环,是浏览器渲染主线程的工作方式。

在 Chrome 的源码中,它开启一个不会结束的 for 循环,每次循环从消息队列中取出第一个任务执行,而其他线程只需要在合适的时候将任务加入到队列末尾即可。

理解异步:JS 是一门单线程的语言,这是因为它运行在浏览器的渲染主线程中,而渲染主线程只有一个。

渲染主线程承担着诸多的工作,渲染页面、执行 JS 都在其中运行。

如果使用同步的方式,就极有可能导致主线程产生阻塞,从而导致消息队列中的很多其他任务无法得到执行。所以浏览器采用异步的方式来避免。

具体做法是当某些任务发生时,比如计时器、网络、事件监听,主线程将任务交给其他线程去处理,自身立即结束任务的执行,转而执行后续代码。当其他线程完成时,将事先传递的回调函数包装成任务,加入到消息队列的末尾排队,等待主线程调度执行。

这种异步模式能最大限度的保证单线程的流畅运行。

概念:执行代码和收集异步任务,在调用栈空闲时,反复调用任务队列里回调函数执行机制

作用:JavaScript 是单线程的,为了不阻塞 JS 引擎,设计执行代码的模型

原理:执行同步代码,遇到异步代码交给宿主浏览器环境执行
异步有了结果后,把回调函数放入任务队列排队
当调用栈空闲后,反复调用任务队列里的回调函数

任务队列

根据 W3C 的最新解释:

  • 每个任务都有一个任务类型,同一个类型的任务必须在一个队列,不同类型的任务可以分属于不同的队列。
    在一次事件循环中,浏览器可以根据实际情况从不同的队列中取出任务执行。
  • 浏览器必须准备好一个微任务队列,微任务队列中的任务优先级最高。

宏任务:

浏览器执行的异步代码
例如:JS 执行脚本事件,setTimeout/setInterval,AJAX请求完成事件,用户交互事件等

微任务:

JS 引擎执行的异步代码
例如:Promise对象.then()的回调

宏任务在微任务之后执行,且每个宏任务结束后都会检查微任务队列。

五:async/await

  1. 定义一个异步函数
    在函数定义前加上async关键字就可以定义一个异步函数。异步函数返回一个Promise对象,可以使用await操作符等待异步操作的结果,而不必处理回调函数或者Promise的then()和catch()方法。

  2. 使用await操作符等待异步操作
    在异步函数中,如果需要等待一个Promise对象完成并返回结果,可以使用await操作符。await只能在async函数中使用,它会暂停异步函数的执行,等待Promise对象的结果返回后再继续执行异步函数。

  3. Promise对象
    async/await的核心是Promise对象。如果一个函数返回一个Promise对象,那么async函数就可以使用await操作符等待该Promise对象返回结果。Promise对象表示一个异步操作的最终结果,可以使用resolve方法或reject方法拿到异步操作的结果或错误信息。

六:css选择器的种类

  1. 元素选择器
  2. 类选择器
  3. id选择器
  4. 通配符选择器
  5. 群组选择器
  6. 后代选择器/相邻兄弟选择器
  7. 属性选择器
  8. 伪类选择器
  9. 伪元素选择器

七·伪类和伪元素的区别

  1. 伪类
    • 定义:伪类用于定义元素的特殊状态或位置。
    • 用途:根据元素的状态(如鼠标悬停、激活、已访问等)或位置(如父元素的第一个子元素)来改变其样式。
    • 常见伪类::hover:active:visited:first-child:nth-child(n)等。
  2. 伪元素
    • 定义:伪元素用于在元素的内容前面或后面插入额外的内容。
    • 用途:在元素的内容前后插入内容,并对这些内容进行样式修饰。
    • 常见伪元素:::before::after等。

八·c3新特性

  1. 文本阴影text-shadow
  2. 边框圆角border-radius
  3. 盒子阴影box-shadow
  4. 背景大小 background-size
  5. 设置背景原点background-origin
  6. 过渡trasition
  7. 2/3D转换
  8. 透视 perspective
  9. 动画

九·vue生命周期

vue生命周期分为四个阶段
第一阶段(创建阶段):beforeCreate,created
第二阶段(挂载阶段):beforeMount(render),mounted
第三阶段(更新阶段):beforeUpdate,updated
第四阶段(销毁阶段):beforeDestroy,destroyed

  1. beforeCreate

    在实例初始化之后,进行数据侦听和事件/侦听器的配置之前同步调用。

    在这个阶段,数据是获取不到的,并且真实dom元素也是没有渲染出来的

  2. created

    在实例创建完成后被立即同步调用。在这一步中,实例已完成对选项的处理,意味着以下内容已被配置完毕:数据侦听、计算属性、方法、事件/侦听器的回调函数。然而,挂载阶段还没开始,且 $el property 目前尚不可用。

    在这个阶段,可以访问到数据了,但是页面当中真实dom节点还是没有渲染出来,在这个钩子函数里面,可以进行相关初始化事件的绑定、发送请求操作

  3. beforeMount

    在挂载开始之前被调用:相关的 render 函数首次被调用。

    代表dom马上就要被渲染出来了,但是却还没有真正的渲染出来,这个钩子函数与created钩子函数用法基本一致,可以进行相关初始化事件的绑定、发送ajax操作

  4. mounted

    实例被挂载后调用,这时 el 被新创建的 vm. e l 替换了。如果根实例挂载到了一个文档内的元素上,当 m o u n t e d 被调用时 v m . el 替换了。如果根实例挂载到了一个文档内的元素上,当 mounted 被调用时 vm. el替换了。如果根实例挂载到了一个文档内的元素上,当mounted被调用时vm.el 也在文档内。
    注意 mounted 不会保证所有的子组件也都被挂载完成。如果你希望等到整个视图都渲染完毕再执行某些操作,可以在 mounted 内部使用 vm.$nextTick:

    挂载阶段的最后一个钩子函数,数据挂载完毕,真实dom元素也已经渲染完成了,这个钩子函数内部可以做一些实例化相关的操作

  5. beforeUpdate

    在数据发生改变后,DOM 被更新之前被调用。这里适合在现有 DOM 将要被更新之前访问它,比如移除手动添加的事件监听器。

    这个钩子函数初始化的不会执行,当组件挂载完毕的时候,并且当数据改变的时候,才会立马执行,这个钩子函数获取dom的内容是更新之前的内容

  6. updated
    在数据更改导致的虚拟 DOM 重新渲染和更新完毕之后被调用。
    当这个钩子被调用时,组件 DOM 已经更新,所以你现在可以执行依赖于 DOM 的操作。然而在大多数情况下,你应该避免在此期间更改状态。如果要相应状态改变,通常最好使用计算属性或 watcher 取而代之。

    这个钩子函数获取dom的内容是更新之后的内容生成新的虚拟dom,新的虚拟dom与之前的虚拟dom进行比对,差异之后,就会进行真实dom渲染。在updated钩子函数里面就可以获取到因diff算法比较差异得出来的真实dom渲染了。

  7. beforeDestroy

    实例销毁之前调用。在这一步,实例仍然完全可用。

    当组件销毁的时候,就会触发这个钩子函数代表销毁之前,可以做一些善后操作,可以清除一些初始化事件、定时器相关的东西。

  8. destroyed

    实例销毁后调用。该钩子被调用后,对应 Vue 实例的所有指令都被解绑,所有的事件监听器被移除,所有的子实例也都被销毁。

    Vue实例失去活性,完全丧失功能

十·mutation和action 区别

mutations在请求数据的时候是同步的;而actions是异步的;

  • action主要处理的是异步的操作,mutation必须同步执行,而action就不受这样的限制,也就是说action中我们既可以处理同步,也可以处理异步的操作
  • action改变状态,最后是通过提交mutation

mutation
this.$store.commit(“mutation函数名”,发送到mutation中的数据)
更改store中状态的唯一方法是提交mutation。

action
this.$store.dispatch(‘action中的函数名’,发送到action中的数据)
不是突变直接操作state值,而是commit mutation之后由mutation操作state

十一·判断数据类型的方法

  1. 使用typeof

    typeof可以测试出numberstringbooleanundefinedfunction

    【注意】:对于null及数组、对象,typeof均检测出为object,不能进一步判断它们的类型。

  2. 使用 instanceof

    obj instanceof Object ,可以左边放你要判断的内容,右边放类型来进行JS类型判断,只能用来判断复杂数据类型,因为instanceof 是用于检测构造函数(右边)的 prototype 属性是否出现在某个实例对象(左边)的原型链上。

  3. 使用Object.prototype.toString.call

    在任何值上调用 Object 原生的 toString() 方法,都会返回一个 [object NativeConstructorName] 格式的字符串。每个类在内部都有一个 [[Class]] 属性,这个属性中就指定了上述字符串中的构造函数名。
    但是它不能检测非原生构造函数的构造函数名。

    let obj = {
                name: 'dawn',
                age: 21
            }
            let fn = function () {
                console.log('我是 function 类型');
            }
            
            console.log(Object.prototype.toString.call(1));        // [object Number]
            console.log(Object.prototype.toString.call('Hello tomorrow')); // [object String ]
            console.log(Object.prototype.toString.call(true));     // [object Boolean]
            console.log(Object.prototype.toString.call(undefined));  // [object Undefined]
            console.log(Object.prototype.toString.call(fn));   // [object Function]
            console.log(Object.prototype.toString.call(new Date));  // [object Date]
            console.log(Object.prototype.toString.call(null));   // [object Null]
            console.log(Object.prototype.toString.call([1, 2, 3]));  // [object Array]
            console.log(Object.prototype.toString.call(obj));       // [object Object]
    
  4. 使用constructor

let arr = [1, 2, 3, 4, 5, 6, 7]
        let obj = {
            name: 'dawn',
            age: 21
        }
        let fn = function () {
            console.log('我是 function 类型');
        }
 
        console.log((9).constructor === Number);  //true
        console.log('hello'.constructor === String);  //true
        console.log(true.constructor === Boolean);  //true
        console.log(fn.constructor === Function);  //true
        console.log((new Date).constructor === Date);  //true
        console.log(obj.constructor === Object);  //true
        console.log([1, 2, 3].constructor === Array);  //true

constructor不能判断undefined和null,并且使用它是不安全的,因为contructor的指向是可以改变的

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2180716.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

序列化方式五——ProtoStuff

介绍 Protostuff是一个基于Java的高效序列化库,它使用Protocol Buffers(简称protobuf)协议,为Java对象提供高效、灵活且易用的序列化和反序列化方法。Protostuff的主要优势在于其高性能和简单的使用方式,相对于其他序…

C#多线程数据同步的几种方式(不同的锁)

无锁 多个关联数据无法完整获取修改 internal class Program{static void Main(string[] args){Console.WriteLine("Hello, World!");ThreadPool.QueueUserWorkItem(Thread1);ThreadPool.QueueUserWorkItem(Thread2);ThreadPool.QueueUserWorkItem(Thread3);Console…

SpringBoot框架在墙绘产品展示中的运用

4 系统设计 墙绘产品展示交易平台的设计方案比如功能框架的设计,比如数据库的设计的好坏也就决定了该系统在开发层面是否高效,以及在系统维护层面是否容易维护和升级,因为在系统实现阶段是需要考虑用户的所有需求,要是在设计阶段没…

linux查看进程所在的目录

在Linux系统中,查看一个进程所在的目录(即该进程的可执行文件所在的目录)可以通过多种方式实现。 以下是查找进程的可执行文件路径的方法: 使用ls -l /proc/[pid]/cwd 你可以通过查看/proc/[pid]/cwd的符号链接来找到进程的可执…

UE5蓝图实战:动态墙上挖坑与自定义坑尺寸

在Unreal Engine 5.3中,我利用蓝图系统开发了一个创新的挖坑Demo,该Demo展示了如何在实时环境中动态地在墙体上挖坑,并允许用户自定义坑的大小。这一过程得益于UE5官方提供的Geometry Script插件,该插件通过蓝图接口实现了强大的网…

sql-labs:42~65

less42(单引号闭合、报错回显) login_useradmin login_password123 and if(11,sleep(2),1) # # 单引号闭合 ​ login_useradmin login_password123and updatexml(1,concat(0x7e,database(),0x7e),1)# # 报错回显…

端模一体,猎豹移动对大模型机器人发展路径清晰

今年世界机器人大会刚刚收官不久,接咖啡、拿苹果、摊煎饼……人形机器人在这届大会上备受关注,厂商们编排“整活”,展位几乎水泄不通。 自从AI大模型开始全面改变市场开始,关于机器人的方向性争论就不绝于耳,就在最近的…

北京中实新材料:携手知名建筑企业,共筑重大工程辉煌篇章

近年来,北京中实新材料有限责任公司(以下简称“北京中实”)凭借其卓越的产品质量、专业的技术服务和良好的市场信誉,积极参与了一系列重大工程项目的建设,与多家知名建筑企业建立了长期稳定的合作关系,共同书写了城市发展的辉煌篇章。 深耕行业,铸就品质基石 自成立以来,北京中…

Python查漏补缺

1.冒泡排序 时间复杂度O(n^2) 选择、插入都是 def bubble(data, reverse):for i in range(len(data)-1):for j in range(len(data)-i-1):if data[j] > data[j1]:data[j], data[j1] data[j1], data[j]if reverse:data.reverse()return data 2.快速排序 时间…

《OpenCV 计算机视觉》—— 图像拼接

还未写完!!! 下面是两张需要拼接的图片 完整代码: import cv2 import numpy as np import sysdef cv_show(name, img):cv2.imshow(name, img)cv2.waitKey(0)def detectAndDescribe(image):gray cv2.cvtColor(image, cv2.COLOR_…

mobile_aloha训练过程中pycharm编辑器遇到的问题记录

目前在研究mobile aloha的训练算法部分,运行文件为imitate_episodes.py,对应指令: # To train ACT: python3 imitate_episodes.py --task_name mobile_imu --ckpt_dir /home/song/hjx/aloha/mobile-aloha_multi-sensor/ckpt/mobile_imu --pol…

Mac屏蔽系统更新,取出红点标记如果解锁hosts文件

引言:关闭系统更新,首先应该在系统偏好设置---软件更新---去掉自动更新的选项。即使如此,系统仍然进行macOS系统和自带safari等软件的检测更新,并图标右上角红点点标记提醒我们更新,那我们如果彻底屏蔽更新呢&#xff…

计算机毕业设计 基于爬虫与文本挖掘的网络舆情监控系统的设计与实现 Python+Django+Vue 前后端分离 附源码 讲解 文档

🍊作者:计算机编程-吉哥 🍊简介:专业从事JavaWeb程序开发,微信小程序开发,定制化项目、 源码、代码讲解、文档撰写、ppt制作。做自己喜欢的事,生活就是快乐的。 🍊心愿:点…

网站建设公司如何选?2024专业网站建设公司哪家好TOP3

要找一家靠谱的网站建设公司,可以根据以下五点判断: 1.企业的工商信息 企业有多少人、什么时候成立的、成立资金是多少、是否有违约记录这些都可以在查企业的那种app里可以看到,去查的时候一定要仔细甄别,别最后找了一家皮包公司…

HarmonyOS/OpenHarmony Audio 实现音频录制及播放功能

关键词:audio、音频录制、音频播放、权限申请、文件管理 在app的开发过程中时常会遇见一些需要播放一段音频或进行语音录制的场景,那么本期将介绍如何利用鸿蒙 audio 模块实现音频写入和播放的功能。本次依赖的是 ohos.multimedia.audio 音频管理模块&am…

基于Python大数据可视化的短视频推荐系统

作者:计算机学姐 开发技术:SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等,“文末源码”。 专栏推荐:前后端分离项目源码、SpringBoot项目源码、Vue项目源码、SSM项目源码 精品专栏:Java精选实战项目…

大模型压缩3种方式;模型大小的计算;知识蒸馏:利用教师的输入输出,训练调整学生的小模型

目录 大模型压缩3种方式 模型大小的计算 知识蒸馏:利用教师的输入输出,训练调整学生的小模型 最终学生学习多个教师的知识,学生强大 大模型压缩3种方式 模型大小的计算 知识蒸馏:利用教师的输入输出,训练调整学生的小模型

商务英语口语柯桥外语学习|ass是“屁股”,save是“救”,那 save my ass是什么意思?

有些人活着,屁股却已经“死”了 工作工作,上工就“坐”,“久坐”几乎是无法避免的事情,但你知道吗,长期久坐可能会患上死臀综合症(Dormant Butt Syndrome)! 如果你坐久了就觉得屁股痛…

imagickd写shell的技术学习

前言 没想到吧哥们,imagickd也能写shell,真是学到了不少,下面会具体分析是如何写shell的 基础知识 Imagick类 参考官方手册https://www.php.net/manual/zh/class.imagick.php 重点关注他的构造方法 (PECL imagick 2, PECL imagick 3) …

基于vue框架的大学生兼职平台r8x19(程序+源码+数据库+调试部署+开发环境)系统界面在最后面。

系统程序文件列表 项目功能:企业,用户,兼职信息,报名记录,岗位类型,专业,取消记录,评价记录 开题报告内容 基于Vue框架的大学生兼职平台开题报告 一、开题报告名称 基于Vue框架的大学生兼职平台 二、研究背景与意义 2.1 研究背景 随着高等教育的普及和就业市…