判断js数据类型，所有方法

JavaScript中常见的数据类型有七种，分别是：Number、String、Boolean、Null、Undefined、Symbol和Object。

以下是判断JavaScript数据类型的几种方法：

1. typeof操作符

typeof操作符可以用来判断JavaScript中的数据类型，它返回一个字符串，表示操作数的类型。例如：

typeof 42 // "number"  
typeof "Hello, world!" // "string"  
typeof true // "boolean"  
typeof undefined // "undefined"  
typeof null // "object"  
typeof Symbol() // "symbol"  
typeof {} // "object"  
typeof [] // "object"  
typeof function() {} // "function"  

需要注意的是，typeof null返回的是object，这是一个历史遗留问题。

2. instanceof操作符

instanceof操作符可以用来判断一个对象是否属于某个类。例如：

const number = 42;  
number instanceof Number // false  
  
const numberObj = new Number(42);  
numberObj instanceof Number // true  
  
const string = "Hello, world!";  
string instanceof String // false  
  
const stringObj = new String("Hello, world!");  
stringObj instanceof String // true  
  
const bool = true;  
bool instanceof Boolean // false  
  
const boolObj = new Boolean(true);  
boolObj instanceof Boolean // true  

需要注意的是，基本类型的值并不是对象，所以它们并不属于对应的包装类，比如42 instanceof Number返回的是false。

3. Object.prototype.toString方法

Object.prototype.toString方法可以用来判断一个值的具体类型，它返回一个字符串，表示对象的类型。例如：

Object.prototype.toString.call(42) // "[object Number]"  
Object.prototype.toString.call("Hello, world!") // "[object String]"  
Object.prototype.toString.call(true) // "[object Boolean]"  
Object.prototype.toString.call(undefined) // "[object Undefined]"  
Object.prototype.toString.call(null) // "[object Null]"  
Object.prototype.toString.call(Symbol()) // "[object Symbol]"  
Object.prototype.toString.call({}) // "[object Object]"  
Object.prototype.toString.call([]) // "[object Array]"  
Object.prototype.toString.call(function() {}) // "[object Function]"  

需要注意的是，Object.prototype.toString.call(null)返回的是[object Null]，这是一个历史遗留问题。

4. Array.isArray方法

Array.isArray方法可以用来判断一个值是否为数组。例如：

Array.isArray([]) // true  
Array.isArray({}) // false  

需要注意的是，Array.isArray并不能判断一个值是否为类数组对象，比如arguments对象。

事件循环的过程，微任务，宏任务

事件循环是浏览器或Node.js中实现异步的一种机制。下面是事件循环的过程：

1. 从宏任务队列中取出一个任务，执行它。 2. 检查微任务队列，如果微任务队列不为空，依次取出任务执行，直到微任务队列为空。 3. 执行渲染操作（如果需要）。 4. 回到第1步。

在事件循环过程中，有两种任务类型：微任务和宏任务。

宏任务是指通过异步方法调度的任务，比如setTimeout、setInterval、requestAnimationFrame、I/O、UI事件等。这些任务会被添加到宏任务队列中，按照添加顺序依次执行。

微任务是指由Promise、Object.observe、MutationObserver等API所产生的任务。这些任务会被添加到微任务队列中，在当前宏任务执行完毕后立即执行。如果在执行微任务的过程中又产生了新的微任务，那么会继续执行这些微任务，直到微任务队列为空为止。在下一个宏任务执行之前，也会检查一次微任务队列。

需要注意的是，微任务的执行优先级高于宏任务，即在执行完当前宏任务后会立即执行所有的微任务，而不是先执行其他宏任务。

html link标签的伪类有哪些，怎么用

HTML中的link标签可以用来引入外部CSS文件。在CSS中，link标签也可以用来添加各种伪类，包括以下几种：

- :hover：鼠标悬停在元素上时触发。 - :active：元素被激活（比如鼠标按下或键盘输入）时触发。 - :focus：元素获得焦点时触发（比如通过Tab键或者鼠标点击）。 - :visited：已经访问过的链接的样式。 - :link：尚未访问过的链接的样式。 - :first-child：选择元素作为其父元素的第一个子元素。 - :last-child：选择元素作为其父元素的最后一个子元素。 - :nth-child(n)：选择元素作为其父元素的第n个子元素，n可以是数字、关键词、表达式等。例如，:nth-child(2)表示选择父元素的第二个子元素，:nth-child(odd)表示选择父元素的奇数子元素。 - :nth-last-child(n)：选择元素作为其父元素的倒数第n个子元素，n可以是数字、关键词、表达式等。

这些伪类可以通过在CSS中的选择器后面添加伪类名称来使用，例如：

a:hover {  
  color: red;  
}  
  
input:focus {  
  outline: none;  
}  
  
ul li:first-child {  
  font-weight: bold;  
}  

以上示例中，第一个选择器会让所有鼠标悬停在链接上时，链接文字的颜色变成红色。第二个选择器会让所有获得焦点的输入框去掉外边框。第三个选择器会让无序列表中的第一个子元素变为粗体。

想实现一个div标签，宽高成比例变化怎么实现!

要实现一个div标签，宽高成比例变化，可以使用CSS中的padding-top属性来实现。具体实现方法如下：

1. 首先设置一个固定的宽度，例如100px。 2. 然后根据需要的宽高比例，计算出padding-top的值。padding-top的值应该等于高度除以宽度再乘以100%。例如，如果需要一个宽高比为2:1的div标签，那么padding-top的值应该为50%。 3. 将padding-top应用到div标签上，并设置其他需要的样式。

例如，下面的CSS代码可以实现一个宽高比为2:1的div标签：

div {  
  width: 100px;  
  height: 0;  
  padding-top: 50%;  
  background-color: #ccc;  
}  

在上面的代码中，将div标签的高度设为0，然后将padding-top设置为50%，这样就可以使div标签的高度自动根据宽度计算出来，从而保证了宽高比例的正确性。