JavaScript面试 题

1.延时加载JS有哪些方式

延时加载 :async defer
例如:<script defer type="type/javascript" src='script.js'></ script>
defer:等html全部解析完成,才会执行js代码,顺次执行的
async:  js和html解析是同步的,不是顺次执行js脚本(谁先加载完先执行谁)

2.JS数据类型有哪些

基本类型:string,number,boolean,undefined,null,symbol,bigint
引用类型:object
NaN是一个数值类型,但不是一个具体的数字

null和undefined的区别
null会被隐式转换为0,很不容易发现错误
为了弥补null的坑所以出现了unfefined 
null是bject类型,undefined是undefined类型
undefined表示变量未初始化或属性不存在
null 表示明确的无或空值

==和===的区别
==比较的是值
===除了比较值还比较类型

3.JS微任务和宏任务

JS是单线程的 ,同一时间只能执行一个任务
JS代码执行流程:同步执行完 ==》事件循环
事件循环 【微任务,宏任务】
	微任务:promise.then
	宏任务:setTimeout..
	要执行宏任务的前提是清空了所有的微任务
同步的任务都执行完了,才会执行事件循环的内容
进入事件循环:请求,定时器,事件...


总体流程:
同步 ==》 事件循环 【微任务和宏任务】 ==》 微任务 ==》 宏任务

4.JS作用域

除了函数外,JS是没有块级作用域的
作用域链:内部可以访问外部的变量,但是外部不能访问内部的变量
	注意:如果内部有,优先查找到内部,如果内部没有就查找外部的,一层一层往外找。
	var a =b =10 ==> var a= window.b = 10
	前面没有类型 默认是window
JS有变量提升机制(变量悬挂声明)
声明变量的优先级是大于声明普通函数的

------
console.log(str) ⇒ undefined
var str ="你好"
-------

-------
var name = 'a'
(function(){
if(typeof name =='undefined'){
	var name = 'b'
	console.log('111'+name)          --> √
}else{
	console.log('222'+name)
	}
})
⇒ 111b 因为内部已经有了name 
-------


-------
console.log(c) ==>undefined (变量提升)
if(false){
	var c= 10
}
console.log(c) ==>undefined (变量提升)
-------

-------
var bar=1
function test(){
console.log(bar) ⇒ undefined
var bar = 2;
console.log(bar) ==>2
}
-------

5.JS对象考题

对象是通过new操作符构建出来的,所以对象之间不相等 (除了引用外)
[1,2,3] === [1,2,3]  ==>false
对象的key都是字符串类型

var a ={}
var b =
key :'aa'
}
var c = {
key:'c'
}
a[b]='123'  =>给a添加了 [Object Object]:123 
a[c]='456'  =>重新赋值 a.[Object Object] =456
console.log(a[b]) =>456
对象如何查找属性
查找规则: 先在对象本身 ==》构造函数 ==》对象原型 ==》构造函数原型找 ==》对象上一层原型

每个函数都自带一个prototype【原型】
	对象拥有 __proto__
new Fun 该Fun构造函数的原型指向于(new Fun)的原型

new的函数 this执行new
否则指向window

在这里插入图片描述
在这里插入图片描述

6.判断是不是数组有哪些方法


1.isArray
	var arr = [1,2,3];
	console.log(Array.isArray(arr)) true
	
2.instanceof
	var arr = [1,2,3]
	console.log(arr instanceof Array) true
	
3.通过原型
	var arr = [1,2,3]
	console.log(Object.protorype.toString.call(arr).indexOf('Array')!==-1)
	
4.isProtorypeOf()
	console.log(Array.prototype.isPrototypeOf(arr))
	
5.construct 
	console.log(arr.constructor.toString().indexOf('Array'))

9.关于slice 和 splice

1.slice是用来截取的
	参数可以写slice(3),slice(1,3),slice(-3)
	返回的是一个新的数组
2.splice功能:插入,删除,替换
	会改变原数组
	splice(从哪开始,删几个元素,'插入的元素')
let removed = arr.splice(2,2) //从索引2开始,删除2个元素
arr.splice(2,0,"apple","orange") 从索引2开始添加两个元素
arr.splice(2,2,"apple","orange")从索引2开始替换两个元素

10.关于数组去重

方式一:new set
var arr1 = [1,2,3,1,2,3]
function unique(arr){
	return [...new Set(arr)]
}
console.log(unique(arr1))
方式二:indexOf
var arr2 = [1,2,3,1,2,3]
function unique(arr){
	var brr = [];
	for(var i =0;i<arr.length;i++){
		if(brr.indexOf(arr[i])==-1){
			brr.push(arr[i])
		}
	}
	return brr
}

11.new操作符具体做了什么

1.创建一个空的对象
2.将空对象的原型,指向于构造函数的原型
3.将空对象作为构造的上下文(改变this指向)
4.对构造函数有返回值的处理判断(如果返回的是基本类型 则忽略 如果是引用类型则返回)
function Fun(age,name){
	this.age=age;
	this.name=name;
}
function create(fn,...args){
//创建一个空对象
var obj = {};
//将对象的原型指向构造函数的原型
Object.setProtorypeOf(obj,fn.prototype)
//将空对象作为构造函数的上下文
var result = fn.apply(obj,args)
return result instanceof Object >result:obj
}
console.log(create(Fun,18,'张三'))

12.关于闭包

1.闭包是什么
闭包是一个函数加上到创建函数的作用域的链接,闭包 关闭了 函数的自由变量 
2.闭包可以解决什么问题
	内部函数可以访问到外部函数的局部变量
	闭包可以解决的问题
	var lis = document.getElementsByTagName('li')
		for(vat i = 0;i<lis.length;i++){
			(function(i){
				lis[i].onclick = function(){
			alert(i)
		}
	})(i)
	}
闭包的缺点
	变量会驻留在内存中,造成内存损耗的问题
	解决:把闭包的函数设置为空
	内存泄漏(ie)

13.原型链

原型可以解决什么问题: 对象共享属性和方法
谁有原型:
函数拥有:prototype
对象拥有:__proto__
对象查找属性或方法的顺序
现在对象本身查找->构造函数中查找->对象的原型->构造函数的原型

14.JS的继承有哪些方式

方式一:ES6

class Parent{
constructor(){
	this.age = 18
	}
}
class Child extends Parent {
	constructor(){
		super();
		this.name='张三'
	}
}
let o1 = new Child()
console.log(o1,o1,name,o1,age)

方式二:原型链继承

function Parent(){
this.age = 20
}
function Child () {
this.name = '张三'
}
Child.prototype = new Parent();
let o2 = new Child();
console.log(o2,o2.name,o2.age)

方式三:借用构造函数继承

function Parent(){
this.age = 12 
}
function Child(){
this.name = '张三'
Parent.call(this)
}
let o1 = new Child()
console.log(o1,o1.name,o1,age)

15.clal apply bind的区别

可以改变指向
语法:函数.call , 函数.apply ,函数.bind
区别:call apply可以立即执行,bind不会立即执行,因为bind返回的是一个函数需要加()执行
后面的参数是传递的参数
apply第二个参数是数组,call和bind有多个参数需要挨个写

16.深拷贝和浅拷贝

浅拷贝:只复制应用 不复制值 地址是一样的
深拷贝:是复制真正的值 两个地址 递归
function copyObj (obj){
if(Array.isArray(obj)){
var newObj = []
}
var newObj = {}
for(var key in obj){
if(typeof obj[key] ==='object'){
newObj[key]=copyObj(obj[key])
}else{
newObj[key]=obj[key]
}

}
return newObj
}

17.localStorage sessionStorage cookie的区别

sessionStorage.setItem('key','123') :仅在当前浏览器窗口关闭
之前有效 【关闭了浏览器之后就没了】

localStorage.setItem('key','123'): 始终有效 窗口或者浏览器
关闭也有效,所以叫持久化存储

cookie:
var data = new Data()
vat time = 3600*60*60*24
time =data.getTIme() +time
data.setTime(time)
documment.cookie = 'key=789;expires = ' +data.toUTSCtring()+''   //设置过期时间

存储大小限制:cookie 不能超过4K
localStorage,sessionStorage不能超过5M

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

AI视频教程下载:零代码创建10个GPTs 和Ai Agents

你将学到什么&#xff1a; 理解GPTs的基础知识&#xff1a;掌握GPTs Agent的基础知识及其在现代AI应用中的作用。 创建自定义ChatGPT Agent&#xff1a;学习构建针对内容创作、沟通和社交媒体管理等多种任务量身定制的ChatGPT Agent。 在商业和个人项目中的实用应用&#xf…

“闻起来有股答辩的味道”,答辩到底是什么味?

“闻起来有股答辩的味道”&#xff0c;答辩到底是什么味&#xff1f; 一位名叫“小鸡全家桶”的作者虚构了这样一个学校故事&#xff0c;故事说&#xff0c;由于学生的考试试卷印刷得特别模糊&#xff0c;导致里面的插图根本看不清&#xff0c;学生感到懵逼&#xff0c;监考老…

Python语法学习之 - 生成器表达式(Generator Expression)

第一次见这样的语法 本人之前一直是Java工程师&#xff0c;最近接触了一个Python项目&#xff0c;第一次看到如下的代码&#xff1a; i sum(letter in target_arr for letter in source_arr)这条语句是计算source 与 target 数组中有几个单词是相同的。 当我第一眼看到这样…

23种设计模式(持续输出中)

一.设计模式的作用 设计模式是软件从业人员长期总结出来用于解决特定问题的通用性框架&#xff0c;它提高了代码的可维护性、可扩展性、可读性以及复用性。 二.设计模式 1.工厂模式 工厂模式提供了创建对象的接口&#xff0c;而无需制定创建对象的具体类&#xff0c;工厂类…

防抖和节流的区别和举例(简要说明、形象比喻、容易理解)

1、含义&#xff1a; 在前端开发技术中&#xff0c;防抖&#xff08;Debounce&#xff09;和节流&#xff08;Throttle&#xff09;是两种常用的性能优化技术&#xff0c;主要用于处理高频事件触发&#xff0c;如用户的点击、滚动、输入等操作。 防抖&#xff08;Debounce&am…

【Linux系统】文件与基础IO

本篇博客整理了文件与文件系统、文件与IO的相关知识&#xff0c;借由库函数、系统调用、硬件之间的交互、操作系统管理文件的手段等&#xff0c;旨在让读者更深刻地理解“Linux下一切皆文件”。 【Tips】文件的基本认识 文件 内容 属性。文件在创建时就有基本属性&#xff0…

Ribbon负载均衡(自己总结的)

文章目录 Ribbon负载均衡负载均衡解决的问题不要把Ribbon负载均衡和Eureka-Server服务器集群搞混了Ribbon负载均衡代码怎么写ribbon负载均衡依赖是怎么引入的&#xff1f; Ribbon负载均衡 负载均衡解决的问题 首先Ribbon负载均衡配合Eureka注册中心一块使用。 在SpringCloud…

Packet Tracer-HSRP+DHCPv4+VLAN间路由+以太通道综合实验

实验拓扑&#xff1a; 实验内容&#xff1a; VLAN及VLAN间路由的配置&#xff0c;以太通道的配置&#xff0c;STP的根调整&#xff0c;DHCPv4的配置&#xff0c;首跳冗余HSRP的配置。 实验最终结果&#xff1a; PC可以自动获取到DHCP-Server分配的IP地址&#xff0c;实现首跳…

【MySQL精通之路】InnoDB(5)-内存结构

总目录&#xff1a; 【MySQL精通之路】InnoDB存储引擎-CSDN博客 上一篇&#xff1a; 【MySQL精通之路】InnoDB(4)-架构图-CSDN博客 目录 ​编辑 1 缓存池&#xff08;Buffer Pool&#xff09; 1.1 缓存池LRU算法 1.2 缓存区配置 1.3 使用InnoDB标准监视器监视缓存池 …

Kettle简介

一、Kettle简介 Kettle是一个开源的ETL&#xff08;Extract-Transform-Load的缩写&#xff0c;即数据抽取、转换、装载的过程&#xff09;项目。 项目名很有意思&#xff0c;水壶。按项目负责人Matt的说法&#xff1a;把各种数据放到一个壶里&#xff0c;然后呢&#xff0c;以…

【Crypto】Rabbit

文章目录 一、Rabbit解题感悟 一、Rabbit 题目提示很明显是Rabbit加密&#xff0c;直接解 小小flag&#xff0c;拿下&#xff01; 解题感悟 提示的太明显了

【Pixso如何对设计好的UI进行切片导出图片文件】

当软件UI设计好之后&#xff0c;并不是直接把设计图给开发就可以了&#xff0c;开发还会向你要各种图标的图片文件&#xff0c;这个时候就要用到”切片”功能了。 1、目的&#xff1a;把所有UI界面的图标都切下来&#xff0c;做成UI图标文件夹 2、在UI界面点击【】-【切片】-‘…

【linux】linux中免交互命令expect原理与应用实战

✨✨ 欢迎大家来到景天科技苑✨✨ 🎈🎈 养成好习惯,先赞后看哦~🎈🎈 🏆 作者简介:景天科技苑 🏆《头衔》:大厂架构师,华为云开发者社区专家博主,阿里云开发者社区专家博主,CSDN全栈领域优质创作者,掘金优秀博主,51CTO博客专家等。 🏆《博客》:Python全…

聚恒中台系统 data.ashx SQL注入致RCE漏洞复现

0x01 产品简介 聚恒中台是山东聚恒网络技术有限公司打造的一款BPM流程管理系统,平台以低代码敏捷开发、流程协同、移动互联、软硬互联、大数据分析等前沿技术为支撑,平台包含8大引擎、16种业务组件,支持三种部署方式,四级权限控制,五大应用模式(PC、手机、PDA、工业平板…

基于EBAZ4205矿板的图像处理:07sobel边缘检测算法

基于EBAZ4205矿板的图像处理&#xff1a;07sobel边缘检测算法 项目文件 随后会上传项目全部文件&#xff0c;和之前一样免费下载 先看效果 如上所见&#xff0c;能够提取图像的边缘&#xff0c;这个sobel边缘检测算法的阈值&#xff08;认定是否为边缘的阈值&#xff09;一样…

与WAF的“相爱相杀”的RASP

用什么来保护Web应用的安全&#xff1f; 猜想大部分安全从业者都会回答&#xff1a;“WAF&#xff08;Web Application Firewall,应用程序防火墙&#xff09;。”不过RASP&#xff08;Runtime Application Self-Protection&#xff0c;应用运行时自我保护&#xff09;横空出世…

设计模式14——组合模式

写文章的初心主要是用来帮助自己快速的回忆这个模式该怎么用&#xff0c;主要是下面的UML图可以起到大作用&#xff0c;在你学习过一遍以后可能会遗忘&#xff0c;忘记了不要紧&#xff0c;只要看一眼UML图就能想起来了。同时也请大家多多指教。 组合模式&#xff08;Composit…

C++ 写的_string类,兼容std::string, MFC CString和 C# 的string

代码例子&#xff1a; using namespace lf; int main() { CString s1 _t("http://www.csdn.net"); _string s2 s1; CString s3 s2; _pcn(s1); _pcn(s2); _pcn(s3); return 0; } 输出&#xff1a; _Str.h /***************************************…

Hsql每日一题 | day02

前言 就一直向前走吧&#xff0c;沿途的花终将绽放~ 题目&#xff1a;主播同时在线人数问题 如下为某直播平台主播开播及关播时间&#xff0c;根据该数据计算出平台最高峰同时在线的主播人数。 id stt edt 1001,2021-06-14 12:12:12,2021-06-14 18:1…

前端加载excel文件数据 XLSX插件的使用

npm i xlsx import axios from axios; axios //这里用自己封装的http是不行的&#xff0c;踩过坑.get(url,{ responseType: "arraybuffer" }).then((re) > {console.log(re)let res re.datavar XLSX require("xlsx");let wb XLSX.read(r…