前端笔试题1

HTML/CSS

题1: 

1.使用CSS 让该节点不可见,方法越多越好。
<div class="hidden"'>Hi</div>

使用CSS 让节点不可见的方法有以下几种:

  • 把 visibility 属性设置为 hidden,这样元素框不会被绘制,但仍然占据布局空间https://developer.mozilla.org/zh-CN/docs/Web/CSS/visibility
  • 把 display 属性设置为 none,这样元素框不会被显示,也不会占据布局空间https://www.runoob.com/css/css-display-visibility.html
  • opacity 属性设置为 0,这样元素框会变成完全透明,但仍然可以响应事件。

   

 题2:

2.在哪些场景下用过 position 的哪些值,它们分别有什么特性?

你好,这是Bing。😊

根据搜索结果,我发现position属性有以下五个值:

  • static:默认值,元素按照正常的文档流进行排列,不受其他定位属性的影响
  • relative:相对定位,元素相对于自己原来的位置进行偏移,但仍然占据文档流中的位置
  • absolute:绝对定位,元素脱离文档流,相对于最近的非static定位的祖先元素进行定位
  • fixed:固定定位,元素脱离文档流,相对于浏览器窗口进行定位,不随滚动条移动31。
  • sticky:粘性定位,元素在滚动时切换为固定定位,相对于最近的滚动祖先和包含块进行定位

 

JavaScript

题3:

3. 什么是单线程?什么是单线程昇步?

单线程和单线程异步的区别是:

  • 单线程是指一个程序或一个进程只能同时执行一个任务,不能同时处理多个任务。
  • 单线程异步是指单线程程序在遇到耗时的操作(如网络请求,定时任务等)时,不会等待其完成,而是继续执行后续的代码,当耗时的操作完成后,再通过回调函数或事件通知单线程程序进行处理。

单线程异步的优点是可以提高程序的效率和响应速度,避免阻塞代码的执行。单线程异步的缺点是代码的逻辑和顺序会变得复杂,需要注意回调地狱和错误处理等问题。

 题4:

	// 4. The output of the following program is
		var fn =[]
		for (var i = 0; i < 10; i++) {
			fn[i] = function (param){
			console.log(i + param)
			}
		}
		fn [5](5)
		var data = {a: 10, b: 20}
		console.log('第'+i+'条数据:'+data)

这段代码的输出是:

15
第10条数据:[object Object]

这是因为var声明的变量会发生变量提升(hoisting),而且没有块级作用域(block scope),所以i的值在循环结束后是10,而不是5。所以,当调用fn[5](5)时,打印出的是i + param,即10 + 5 = 15。然后,打印出'第'+i+'条数据:'+data,即’第10条数据:’ + ‘[object Object]’。如果想要打印出5 + 5 = 10,可以使用let声明变量,它会创建块级作用域,每次循环都会创建一个新的变量。

题5:

	// 5. The output of the following program is
		console.log(1)
		setTimeout(() => {
			console.log(2)
		}, 0)
		console.log(3)
		new Promise((resolve, reject) => {
		console.log(4)
		resolve()
		}).then(() => {
		console.log(5)
		}, () => {
		console.log(6)
		})
		console.log(7)

这段代码的输出是:

1
3
4
7
5
2

这是因为JavaScript是单线程的,它会先执行同步代码,然后再执行异步代码。异步代码又分为微任务(microtask)和宏任务(macrotask),微任务的优先级高于宏任务。setTimeout是一个宏任务,Promise.then是一个微任务。所以,同步代码会按照顺序打印出1、3、4、7,然后微任务队列中的Promise.then会打印出5,最后宏任务队列中的setTimeout会打印出2。

 题6:

// 5. The output of the following program is
			const a=[1,1,1,1,1]
			for (let i = 0; i< 5; i++) {
				for (let j = 0; j < i; j++) {
					a[i] = a[i]+ a[j]
				}
			}
			for (let i = 0; i < 5; i++){
			console.log(a[i])
			}

 这段代码的输出是:

1
2
4
8
16

这是因为这段代码实现了一个斐波那契数列(Fibonacci sequence),它的规律是每一项都等于前两项之和。所以,a[1] = a[0] + a[0] = 1 + 1 = 2,a[2] = a[1] + a[0] = 2 + 1 = 4,以此类推。

 题7:

// 7.写出①所在的 while循坏的作用;补全②的代码。
			// isSymmetry 用来判断正整数n是否是一个对称数,例:12321是对称数,而123不是
			function isSymmetry (n) {
			let i=n 
			let j=0
			// ①
			while (i) {
			j=j*10+i%10
			i=parseint(i/10)
			// return ②
			console.log(isSymmetry (12321)) // true 
			console.log(isSymmetry (1231)) // false

这段代码的①所在的while循环的作用是将n的每一位反转,得到一个新的数j。例如,如果n是12321,那么j就是12321;如果n是1231,那么j就是1321。

补全②的代码的一种可能方法是:

return j === n

这样就可以判断j和n是否相等,如果相等,说明n是一个对称数,返回true;如果不相等,说明n不是一个对称数,返回false。

 题8:

// 8. 把数组倒序輸出(不是排序)(不能用内置方法)
			const arr = ['name', 'first', '5', 7, 4, '2', 9]

一种把数组倒序输出的方法是:

const arr = ['name', 'first', '5', 7, 4, '2', 9]
let len = arr.length // 获取数组长度
for (let i = len - 1; i >= 0; i--) { // 从后往前遍历数组
  console.log(arr[i]) // 输出每一项
}

这样就可以得到以下输出:

9
2
4
7
5
first
name
``

题9:

// 9(过一面必做题)数组中的重复项最多出现N次。(时间复杂度越低得分越高)
			原题9.1:
			outputNth([1, 1, 1, 11], 2) // return[1,1])(按原数组出现的先后返回,合并到一起)
			outputNth([20,37,20,20, 21],2)//return [20,20,37,21](按原数组出现的先后返回,合并到一起)
			原题9.2:
			如果要求outputNth([20,37,20,20,21],2)//return [20,37,20,21]呢?(按原数组出现的先后返回)
			题9.1: function outputNth (array.n){
			题9.2:function outputNth (array, n){}请预估自己的时间复杂度:}请预估自己的时间复杂度:

这两道题都可以用一个哈希表(hash table)来记录每个元素出现的次数,然后遍历数组,根据不同的要求输出结果。具体的代码如下:

题9.1:

function outputNth(array, n) {
  let hash = {} // 创建一个空的哈希表
  let result = [] // 创建一个空的结果数组
  for (let num of array) { // 遍历数组中的每个元素
    if (hash[num]) { // 如果哈希表中已经有这个元素
      hash[num]++ // 将其出现次数加一
    } else { // 如果哈希表中没有这个元素
      hash[num] = 1 // 将其出现次数设为一
    }
    if (hash[num] <= n) { // 如果这个元素出现次数小于等于n
      result.push(num) // 将其加入结果数组
    }
  }
  return result // 返回结果数组
}

题9.2:

function outputNth(array, n) {
  let hash = {} // 创建一个空的哈希表
  let result = [] // 创建一个空的结果数组
  for (let num of array) { // 遍历数组中的每个元素
    if (hash[num]) { // 如果哈希表中已经有这个元素
      hash[num]++ // 将其出现次数加一
    } else { // 如果哈希表中没有这个元素
      hash[num] = 1 // 将其出现次数设为一
    }
    if (hash[num] === n) { // 如果这个元素出现次数等于n
      result.push(num) // 将其加入结果数组
    } else if (hash[num] < n) { // 如果这个元素出现次数小于n
      result.push(num) // 将其加入结果数组
      result.push(null) // 同时在后面加入一个空值,用来占位,方便后面删除多余的元素
    }
  }
  return result.filter(item => item !== null) // 返回结果数组,并过滤掉空值
}

这两道题的时间复杂度都是O(n),因为只需要遍历一次数组,哈希表的查找和插入操作都是常数时间。

题10: 

 

 

可以参考一下:

// 定义一个栈类
class Stack {
  // 构造函数,初始化一个空数组作为栈
  constructor() {
    this.items = []
  }

  // 入栈操作,将元素添加到栈顶
  push(element) {
    this.items.push(element)
  }

  // 出栈操作,将栈顶元素移除并返回
  pop() {
    return this.items.pop()
  }

  // 查看栈顶元素,不改变栈
  peek() {
    return this.items[this.items.length - 1]
  }

  // 判断栈是否为空
  isEmpty() {
    return this.items.length === 0
  }

  // 获取栈的大小
  size() {
    return this.items.length
  }

  // 清空栈
  clear() {
    this.items = []
  }

  // 打印栈中的元素
  print() {
    console.log(this.items.toString())
  }
}

// 创建一个栈对象
let stack = new Stack()

// 测试入栈操作
stack.push(5)
stack.push(8)
stack.push(11)
stack.push(15)

// 测试打印操作
stack.print() // 输出 [5,8,11,15]

// 测试出栈操作
console.log(stack.pop()) // 输出 15
console.log(stack.pop()) // 输出 11

// 测试查看操作
console.log(stack.peek()) // 输出 8

// 测试其他操作
console.log(stack.isEmpty()) // 输出 false
console.log(stack.size()) // 输出 2

// 测试清空操作
stack.clear()
console.log(stack.isEmpty()) // 输出 true

这就是完整的代码,你可以运行一下看看效果。希望这能帮助你理解栈这种数据结构。😊

 

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

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

相关文章

nodejs+vue+elementui学生档案信息管理系统_06bg9

利用计算机网络的便利&#xff0c;开发一套基于nodejs的大学生信息管理系统&#xff0c;将会给人们的生活带来更多的便利&#xff0c;而且在经济效益上&#xff0c;也会有很大的便利!这可以节省大量的时间和金钱。学生信息管理系统是学校不可缺少的一个环节&#xff0c;其内容直…

公司自建机房IDC还是选择云服务器?以腾讯云为例

大企业是选择自购服务器自建机房还是使用腾讯云服务器&#xff1f;都说企业上云是趋势&#xff0c;自建机房是一次性支出&#xff0c;上云租赁云服务器等产品需要年年续费&#xff0c;大型企业有必要把数据中心迁移上云吗&#xff1f;腾讯云服务器网想说&#xff0c;自建机房购…

面试八股文Mysql:(2)数据库调优

1. SQL优化很有必要 数据库优化在提升系统性能是很重要的一个方面&#xff0c;不管是MySQL还是MongoDB还是其它的数据库。 SQL优化在提升系统性能中是成本最低 && 优化效果最明显的途径&#xff0c;可以让吞吐量更大&#xff0c;响应速度更快。如果你的团队在SQL优化这…

安防监控视频汇聚平台EasyCVR分发的FLV视频流在VLC中无法播放是什么原因?

众所周知&#xff0c;TSINGSEE青犀视频汇聚平台EasyCVR可支持多协议方式接入&#xff0c;包括主流标准协议国标GB28181、RTSP/Onvif、RTMP等&#xff0c;以及厂家私有协议与SDK接入&#xff0c;包括海康Ehome、海大宇等设备的SDK等。在视频流的处理与分发上&#xff0c;视频监控…

集合数据类型

非数字型 列表[]&#xff08;其他语言叫数组&#xff09; 注意点&#xff1a;第一个成员的索引编号为0&#xff0c;不能访问不存在的索引编号 # list是列表变量名&#xff0c;列表中有三个成员 list[刘备,曹操,关羽] print(list[0]) print(list[1]) print(list[2]) print(li…

XXLJOB 怎么用

目录 1、数据库执行sql语句&#xff0c;建立表 2、配置Admin &#xff0c;连接xxl_job数据库 3、启动admin&#xff0c;访问 http://localhost:8080/xxl-job-admin 4、需要定时任务的微服务里导入依赖 5、配置yml&#xff08;admin地址&#xff0c;执行器名字 端口&#x…

湘大 XTU OJ 1260 Completed String 题解(非常详细):建立数组下标和数组元素之间的映射关系 ~scanf

一、链接 1260 Completed String 二、题目 题目描述 给一个字符串&#xff0c;请判断字符串是否出现了所有的英文字母&#xff08;不区分大小写&#xff09;。 输入 每行一个只含英文字母的字符串&#xff0c;长度不超过1000。 输出 每行输出一个样例的结果&#xff0c…

Vue.js2+Cesium1.103.0 七、Primitive 绘制航线元素

Vue.js2Cesium1.103.0 七、Primitive 绘制航线元素 用 Primitive 绘制航线元素&#xff0c;包括航点图标&#xff0c;航线线段&#xff0c;线段距离标注&#xff0c;航点序号&#xff0c;海拔标注&#xff0c;总航程等信息。 可同时绘制多条航线&#xff1b;可根据 id 清除指…

基于Vue+wangeditor实现富文本编辑

目录 前言分析实现具体解决的问题有具体代码实现如下效果图总结前言 一个网站需要富文本编辑器功能的原因有很多,以下是一些常见的原因: 方便用户编辑内容:富文本编辑器提供了类似于Office Word的编辑功能,使得那些不太懂HTML的用户也能够方便地编辑网站内容。提高用户体验…

【C++】虚继承(virtual base classes)

【C】虚继承&#xff08;virtual base classes) 文章目录 【C】虚继承&#xff08;virtual base classes)1. 使用原因2. 解决方法3. 例题练习 1. 使用原因 在多重继承(Multiple Inheritance) 的情况下&#xff0c;尤其是菱形继承时&#xff0c;容易出现问题&#xff0c;关于菱…

SpringSecurity 详解(通俗易懂)

SpringSecurity 详解 1、SpringSecurity讲解1.1、SpringSecurity完整流程1.2、认证流程 2、登录&#xff0c;退出&#xff0c;注册_分析说明2.1、登录2.2、校验2.3、退出2.4、注册2.5、SecurityContextHolder说明 3、代码实现3.1、引入依赖3.2、登录 退出 注册3.2.1、SpringSec…

Xcode 基座打包

Xcode基座打包-APP更新版本内容无效 问题&#xff1a;解决&#xff1a; 问题&#xff1a; 使用xcode基座打包之后&#xff0c;上传到appstore进行提审发布。 用户在appstore商城进行更新下载&#xff0c;打开更新后的APP发现版本号是最新的&#xff0c;APP里面的其他内容还是上…

HTML5基础

1、HTML5概述 2014年10月28日&#xff0c;W3C&#xff08;world wide web consortium&#xff0c;万维网联盟&#xff09;的HTML工作组发布了HTML5的正式推荐标准。HTML5作为构建开放Web平台的核心&#xff0c;增加了支持Web应用的许多新特性&#xff0c;以及更符合开发者使用…

Arcgis地图实战二:地图实时轨迹展示

1.最终效果预览 2.定时器执行方法 进入页面执行执行器 this.locationInterval setInterval(() > {this.getCurrentPosition();}, this.conf.LocateInterval);离开页面销毁 clearInterval(this.locationInterval);this.conf.LocateInterval为获取的数据同步中的定时器间隔…

你的服务器安全吗?--服务器防渗透

1、概述 在本人所处的公司的服务器正式遭到黑客攻击之前&#xff0c;一直都以为 黑客 是个遥不可及的词&#xff0c;直到真正成为了受害者时&#xff0c;才猛然意识到安全的重要性。有一些基本经验和心得总结出来&#xff0c;和同行分享一下吧。 2、暴破手段 最粗暴的黑客行为…

C++ 多态性——虚函数

虚函数是动态绑定的基础。虚函数必须是非静态的成员函数。虚函数经过派生之后&#xff0c;在类族中就可以实现运行过程的多态。 根据类型兼容规则&#xff0c;可以使用派生类的对象代替基类的对象。如果基类类型的指针指向派生类对象&#xff0c;就可以通过这个指针来访问该对…

用ChatGPT和六顶帽思考法帮助自己更好地决策和解决问题

当我们在解决复杂问题时&#xff0c;我们常常陷入单一视角的状态。创造性思维领域的先驱爱德华德博诺&#xff0c;提出了六顶帽思考法[1]&#xff0c;这意味着我们可以从六个不同的视角来思考一个问题&#xff0c;以实现高水平决策和解决问题。 每一顶“帽子”代表不同的视角。…

【写一个函数,判断一个字符串是否为另外一个字符串旋转之后的字符串】

写一个函数&#xff0c;判断一个字符串是否为另外一个字符串旋转之后的字符串 1.题目 写一个函数&#xff0c;判断一个字符串是否为另外一个字符串旋转之后的字符串。 例如&#xff1a;给定s1 AABCD和s2 BCDAA&#xff0c;返回1 给定s1abcd和s2ACBD&#xff0c;返回0. AABCD左…

当前服务器版本不支持该功能,请联系经销商升级服务器 - - 达梦数据库报错

当前服务器版本不支持该功能&#xff0c;请联系经销商升级服务器 - - 达梦数据库报错 环境介绍1 搭建测试环境2 报错内容3 标准版介绍 环境介绍 某项目使用标准版数据库中&#xff0c;使用insert into 正常操作表&#xff0c;插入数据时报错&#xff0c;表为普通表。 1 搭建测…

sharedPreferences的使用之按钮状态切换的保存

什么是sharedPreferences&#xff1f;有什么用 SharedPreference是Android开发中一个轻量级的数据存储的方式&#xff0c;除了它还有SQLite数据库。它可以将数据以键值对的形式存放到文件中&#xff0c;在需要的时候再取出来使用。相比于去操作数据库&#xff0c;对于一些简单…