记录人生第一次职场面试——前端实习生面试

 2020-07-04 

之前因为自己基础知识掌握得不太行,只投过一家小公司笔试没过。前几天不小心点开了一家公司的boss直聘的立即沟通,没想到软件自动给对方发了一条消息。第二天hr要我把简历发过去,既然这样也就顺势而为了,说不定是一个机会呢。昨天上午公司发了一封邮件给我说2号和3号两天自己选时间进行ai视频面试。
今日下午,稍作打扮,我打开了daydao视频面试,人生第一次,虽然是机器人,也有一些紧张。

一共有五个问题:

1、你是什么专业的?为什么学习前端?
2、html中行内元素有哪些,块状元素有哪些?他们有什么区别?
3、你能解释一下js中的this吗?
4、cookies、sessionstorage和localstorage的区别?
5、你在学习中遇到过什么困难,是如何解决困难的?

这几个问题是很简单了,但我个人感觉答的不是很好。第二题行内元素的宽高有点记混了,this也答得不是很多,还剩下很多时间,最后一题我好像并没有回答自己遇到的困难,只答了如何解决。在此我再次整理一下问题:

2、html中行内元素有哪些,块状元素有哪些?他们有什么区别?

1
2
3
4
5
6
块状元素独占一行,如果不设置宽高,则默认为父级宽高,有:div、p、h1、address、ul、li、table、form等;
内联元素设置宽高无效,只需要必要的宽度(文字宽高),不换行:span、a、br、i,且文本里只能容纳其他行内元素
行内块元素:用display:inline-block设置,img、input、td都是行内块元素:
1)和相邻行内元素,行内块元素在一行上,但是他们之间有空隙(行内元素特点)
2)默认宽度是它本身的文本宽度(行内元素特点)
3)高度、行高、内边距、外边距都可以控制(块级元素特点)

3、你能解释一下js中的this吗?

  • this总是指向函数的直接调用者(而非间接调用者)
  • 如果有new关键字,this指向new出来的那个对象
  • 在事件中,this指向触发这个事件的对象,特殊的是,IE中的attachEvent中的this总是指向全局对象Window

4、cookies、sessionstorage和localstorage的区别?

  • cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密)
  • Cookie是服务器发送到浏览器的一小段数据,会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上。
  • sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存
  • 存储大小:
    cookie数据大小不能超过4k
    sessionStorage和localStorage虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大
  • 有期时间:
    localStorage 存储持久数据,浏览器关闭后数据不丢失除非主动删除数据
    sessionStorage 数据保存在当前会话,刷新页面数据不会被清除,结束会话(关闭浏览器、关闭页面、跳转页面)数据失效。
    cookie 设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。

我的sessionStorage尝试:

1
2
3
4
5
6
7
8
9
10
<script>
    function submit() {
        let input = document.getElementById("input")
        sessionStorage.setItem("session", input.value)
    }
</script>

<body>
    <input type="text" id="input"><button onclick="submit()">submit</button>
</body>

结果:
在这里插入图片描述
刷新后仍存在
关闭此窗口:
在这里插入图片描述
不存在了。
而localstorage一直存在。