JavaScript深拷贝浅拷贝

深克隆和浅克隆

先来看一段代码

1
2
3
let obj = {
a: 1,
}

Mehr lesen

从输入网址到网页显示出来发生了什么

关于这个问题,网上的答案已经很多了,但是每个人的答案侧重点都不同。
而我想尽可能详细地了解这个问题的答案,故写了此文。

概览

首先,这个过程包括以下部分:

Mehr lesen

同源策略

不能直接跨窗口通信的原因就是同源策略。之所以单独提出跨窗口通信,是因为这是一个比较典型的问题。 其实网上关于同源策略(same-origin policy)的文章已经很多了,但是或者不够全面,或者条理不够清晰,导致阅读起来比较麻烦。我在这里做一个比较全面、条理清晰的总结。

同源策略定义

Wikipedia上的定义:

Mehr lesen

词法作用域、作用域链、执行上下文栈

词法作用域、作用域链、执行上下文栈

1
2
3
4
5
6
7
8
9
10
var globalVar = 1;
function outer(param) {
var a = 3 + param;
function inner(param) {
var b = 4;
return a + b + param;
}
return inner(2);
}
outer(1);

Mehr lesen

box-sizing

box-sizing是我们布局的时候经常要设置的一个CSS属性,影响CSS的盒模型

box-sizing有两个值: content-box 和 border-box

我们都知道CSS盒模型是有四部分组成的:content edge, padding edge, border edge, margin edge。

Mehr lesen

css 权重(CSS 优先级)

很多时候,我们发现自己设置的CSS样式并没有生效,当我们用浏览器调试窗口查看的时候,发现它被其他样式覆盖了,这便是CSS权重搞的鬼。理解CSS权重,可以帮助我们更好地选择要应用的样式。

概念

Mehr lesen

js 各种宽度高度总结

js中有很多与高度宽度相关的属性,这篇文章旨在对这些属性做一个全面易懂的总结。

属性

  • window.innerWidth/innerHeight:浏览器视口(viewport)宽度(包括竖直/水平滚动条,不包括浏览器标题栏,导航栏,地址栏,书签栏等)。

Mehr lesen