牛客面经每日一总结(六)

ES6中两个对象的合并有几种方法

  • Object.create(), 参数二:新创建的对象添加具有对应属性名称的属性描述符。一般用在es5继承中。

  • Object.assign(),合并可枚举的自身属性。

  • {...obj1, ...obj2}

JSON可以序列化哪些值

序列化之后,他会自动删除值为函数,undefined, Symbol值的属性。 Set, Map属性值,设置后无值。但是有对应的该属性。

    const obj = {
      bar() {
        return 1
      },
      a: null,
      b: undefined,
      c: Symbol()
    }

    const info = JSON.parse(JSON.stringify(obj)) 

手写ajax

    
    if (window.XMLHttpRequest) { 
        httpRequest = new XMLHttpRequest();
    } else if (window.ActiveXObject) { 
        httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
    }
    
    
    httpRequest.onreadystatechange = function(){
        if (httpRequest.readyState === 4) {
          if (httpRequest.status === 200) {
            alert(httpRequest.responseText);
          } else {
            alert('There was a problem with the request.');
          }
        }
    };
    
    httpRequest.open('GET', 'http://www.example.org/some.file', true);
    
    httpRequest.send();

遍历数组的方法中有哪些是不能中断的

一些高阶方法都不可以中断。forEach, map, every, some, find, reduce等等。

正常的for循环都可以中断。for, for in, for of。

解释一下你认为的h5

他并不是指HTML5标准,而是一种解决我们现代网页制作的方案。

H5实际上是一个解决方案,不仅包含了HTML5新增的audio标签,canvas,拖拽特性,本地存储,websocket通信,同时也包括了盒模型,包括绝对定位,包括一切前端的基本知识。

是按照 HTML5 规范实现的页面,其中用到了许多新的特性。

https是否可以被拦截

???如果要我回答,拦截是肯定可以拦截的,但是数据都被加密,不会被破解。

会被抓包,HTTPS 只防止用户在不知情的情况下通信被监听,如果用户主动授信,是可以构建“中间人”网络,代理软件可以对传输内容进行解密。

css的引入方式

  • 行内样式(行间样式、内联样式、行嵌样式): 在网页元素上通过 style="" 属性直接写样式。

  • 内部样式表: 在网页上创建嵌入的样式表,通常写在 <head></head> 里面。style标签中。这里的样式是html解析器解析的,所以边解析css,边解析html,可能会出现闪屏现象。

  • 链入外部样式表: 将网页链接到外部样式表。先创建一个 CSS 文件,再在 HTML 中通过 <link> 链接此 CSS 文件。一般写在 <style></style> 的前面。link可以异步去加载css,不需要等待dom解析完毕。

  • 导入外部样式表: 通过 @import 引入其他的 CSS 文件。写在style标签中。**@import 需要网页结构完全载入以后加载样式文件。**

比较一下上面这些引入方式的权重。

行内样式 > 内部样式 == link引入 > @import

所以内部样式和link方式引入的css,后者覆盖前者的样式。然后再看其选择器的权重。

给span设置margin, padding有效吗

~padding是个方向都是有效的。但是margin上面方向不生效。 ~ padding四个方向都是有效的。但是margin上下方向不生效。

< img style="400px !important"/>怎样修改宽高为300px

我个菜鸡,就只能想到第一种方式,哎。

注意max-width权重大于width。

    img {
      transform: scaleX(0.75);
    }
    
    img {
      box-sizing: border-box;
      padding: 0 50px;
    }
    
    img {
      max-width: 300px !important;
    }

https使用的是对称加密还是非对称加密

在生成pre-master时,使用的是非对称加密,最后通过client-random, service-random, pre-master使用的是对称加密。

还有就是在生成数字签名的使用的是非对称加密。

语义化标签有哪些, 语义化标签的行内标签有哪些

article, aside, details, figcaption, figure, footer, header, main, mark, nav, section, summary, time。

行内标签

  • abbr:缩写

  • em:强调

  • strong:粗体强调

  • mark:突出显示的文本

  • b:粗体

  • i:斜体

  • big:大字体

  • small:小字体

  • sup:上标

  • sub:下标

  • del:被删除的文本

  • strike:删除线

  • s:删除线

  • ins:被插入的文本

  • u:下划线

  • time:日期/时间

  • cite:引用

  • q:短引用("")

  • font:字体设定

css可以实现哪些交互事件

  • checked 表单元素被选中的元素

  • focus 选中表单聚焦的元素

  • link 未移入时的状态

  • visited 表示用户已访问过的链接状态

  • hover 引入后的状态

  • active 鼠标按下的状态 其他所有的伪类选择器请查看这里[1]

css动画有哪些属性

animation-name

定义动画的名称,@keyframes会根据名称来执行那个标签的动画。

animation-duration

定义动画的持续时长。

animation-timing-function

定义动画的过度曲线。

animation-delay

定义动画延迟多少秒执行

animation-iteration-count

动画重复的次数。一般为infinite,表示无限次。

animation-direction

动画的方向。就是每次动画结束后,怎么进行下一次动画。

  • normal:每个循环内动画向前循环,换言之,每个动画循环结束,动画重置到起点重新开始,这是默认属性。

  • alternate:动画交替反向运行,反向运行时,动画按步后退,同时,带时间功能的函数也反向,比如,ease-in 在反向时成为 ease-out。计数取决于开始时是奇数迭代还是偶数迭代

  • reverse:反向运行动画,每周期结束动画由尾到头运行。

  • alternate-reverse: 反向交替,反向开始交替。动画第一次运行时是反向的,然后下一次是正向,后面依次循环。决定奇数次或偶数次的计数从 1 开始。

animation-fill-mode

确定动画在执行之前和之后这两个阶段应用的样式。就是表示动画执行结束后,他所处的状态。

  • none 当动画未执行时,动画将不会将任何样式应用于目标,而是已经赋予给该元素的 CSS 规则来显示该元素。这是默认值。就是使用该元素非动画的样式值,不适用任何动画时的样式值。

  • forwards 目标将保留由执行期间遇到的最后一个关键帧计算值

  • backwards 动画将在应用于目标时立即应用第一个关键帧中定义的值。并在animation-delay期间保留此值并不是我认为的在动画期间保留动画之前的值。

  • both 动画将遵循forwardsbackwards的规则,从而在两个方向上扩展动画属性。就是在animation-delay使用的是0%状态下的动画样式,在动画结束时,使用的是100%状态下的样式值。

animation-play-state

确定动画是否正在播放。

  • paused 暂停当前动画。

  • running,这个是默认值。 执行当前动画。

http / 1.1的纯文本传输与http / 2的二进制协议有什么区别

这还是在b站一up模拟面试看见的。他解释的是纯文本最后也使用的是二进制传输,并且会将每个头字段的换行符而转为二进制,增加了传输的带宽。

null==0是 false 还是true null>=0 返回啥呢?

    null == 0 
    null >= 0 

null只有和undefined/null才会为true, null和其他值==比较时,都是false。

  • == 两边的操作数,最后都会通过ToNumber来将其转换为number类型进行比较。

  • 如果操作数是对象类型,那么将通过ToPromitive来将其转为基本数据类型,然后再通过ToNumber来转为数字进行比较。

如果null做大小比较时,他会被转为0。所以null >= 0为true。因为调用了Number方法,但是对于undefined就都为false。因为undefined被Number转换后为NaN。

git

我使用git主要就是将我的项目推送到github上。

    
    
    git clone 地址
    
    
    git add .
    
    git status
    
    git commit -m "文件介绍"
    
    git push -u origin master

    
    
    git checkout -b 分支名
    
    
    git checkout 子分支
    
    git branch
    
    git add .
    
    git commit -m '...分支完成'
    
    git push -u origin 子分支名称

    
    
    git checkout master
    git merge 子分支名称
    
    git commit -m "...完成"
    
    git push

css预处理器说一下

CSS 预处理器是一个能让你通过预处理器自己独有的语法来生成CSS的程序。

代码混合,嵌套选择器,继承选择器等。

sass, less, stylus, postcss。

pnpm

  • 包的安装速度非常快。

  • 磁盘空间利用非常高效(基于内容寻址)。
    • 不会重复安装同一个包。

    • 即使一个包的不同版本,pnpm 也会极大程度地复用之前版本的代码。

  • 支持 monorepo monorepo 的宗旨就是用一个 git 仓库来管理多个子项目,所有的子项目都存放在根目录的packages目录下,那么一个子项目就代表一个package

  • 安全性高。因为npm,yarn管理包是扁平化的,所有的依赖都放在顶层的node_modules下,即使package.json中未指定的包,也会放在node_modules中,项目中如果引用了这些包,将会造成不必要的安全问题。

  • 26
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Web面试那些事儿

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值