2021年のフロントエンドインタビュー：
フロントエンドのインタビューで遭遇したなじみのない、または興味深い知識のポイントを記録して、全員と共有します
目次
切り替える3つのボタンを実装する場合は、ボタンのスタイルを変更します。
二分木順序深さトラバーサルおよびバックトラッキングアルゴリズム
切り替える3つのボタンを実装する場合は、ボタンのスタイルを変更します。
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<!-- 单选框 -->
<div>
<ul class="buttonList">
<li class="active">按钮1</li>
<li>按钮2</li>
<li>按钮3</li>
</ul>
</div>
</body>
<script>
function siblings(elm) {
var a = []; // 保存所有兄弟节点
var p = elm.parentNode.children; // 获取父级的所有子节点
for (var i = 0; i < p.length; i++) { // 循环
if (p[i].nodeType === 1 && p[i] !== elm) { // 如果该节点是元素节点与不是这个节点本身
a.push(p[i]); // 添加到兄弟节点里
}
}
return a;
}
let litag = document.getElementsByTagName('ul')[0];
litag.addEventListener('click', function(e) {
if (e.target.tagName === 'UL') {
return ;
}
e.stopPropagation();
e.target.classList.add('active');
let sibling = siblings(e.target);
for (var j = 0; j < sibling.length; j++) {
sibling[j].classList.remove('active');
}
});
</script>
<style>
.buttonList{
color: red;
}
.active{
color:blue;
background-color: lightgoldenrodyellow;
}
li{
background-color: yellow;
width: 50px;
height: 50px;
text-align: center;
line-height: 50px;
margin: 10px 0;
list-style-type:none ;
display:inline-block;
}
</style>
</html>オン[]
[]==[]//false
[]!==[]//true
[]==![]//true3番目のものだけを説明してください：https：//blog.csdn.net/qiqi_77_/article/details/79456605から転送されました
==と===の違いは誰もがはっきりしていると思います。この理解は繰り返されません。今日は[] ==！[]の結果を見ていきます。
これは、ホストが遭遇したインタビューの質問です、ええと、それは間違って豪華に答えました：
[] == [] // false、これは常識です。両側が同じデータ型の場合、==は両側のデータを直接比較するため、[]は参照型に属するため、結果はfalseになります。 、および2つの[]ポイントは、異なるヒープメモリ、参照型に精通していない友人を指します。元のポスターを参照してください。値型参照型。
そして現在の質問：
[] ==！[] // true
この結果はどのように出てきましたか？
まず第一に、私たちはそれを知っています！の優先度は==より大きいため、右側が最初に計算されます！[] ---->結果はfalse、
したがって、[] ==！[]は次と同等です。
[] == false
もう一度見てみると、現時点では、==の両側のデータ型が等しくありません。==の両側のデータ型に一貫性がない場合は、最初にデータ型変換を実行してから、次にデータ型変換を実行する必要があることがわかっています。 ==型変換ルールは次のとおりです。
值类型 == 值类型 //相当于 Number(值类型) == Number(值类型)
引用类型 == 值类型 // 对象转化成原始类型的值，再进行比较
比较规则：数组与数值进行比较，会先转成数值，再进行比较；与字符串进行比较，会先转成字符串，再进行比较；与布尔值进行比较，两个运算子都会先转成数值，然后再进行比较。値型間==：
'true' == true //false，Number('true')为NAN，Number(true)为1次に、質問値タイプと参照タイプ==
[] == false //相当于，Number([])为0，Number(false)为0，
所以0==0//true。
过程：[]==![] ----> []==false -----> 0==0 --->//true実際、詳細については、知乎の回答を参照してください。[]はオブジェクトであるため、比較プロセスはToPrimitive（[]）== falseに基づいています。ToPrimitiveはデフォルトでtoStringメソッドを呼び出すため、ToPrimitice（[]）は空の文字列、つまり「== false」に等しく、次にToNumber（ ''）== 0、つまり0 == 0、trueになります。 。添付リンク：ZhihuBelleveユーザーの回答。
等式演算子（==）によって隠された型変換は、直感に反する結果をもたらします。それらのいくつかを次に示します。
0 == '' // true
0 == '0' // true
2 == true // false
2 == false // false
false == 'false' // false
false == '0' // true
false == undefined // false
false == null // false
null == undefined // true
' \t\r\n ' == 0 // true
\ t \ r \ nはすべてエスケープ文字で、スペースは純粋なスペースです。入力時にスペースを入力できます。
\ tは水平方向に次のタブ位置にスキップすることを意味します。
\ rはキャリッジリターンを意味します。
\ nはリターンカーラップを意味します
- ——————————————
著作権ステートメント：この記事は、CSDNブロガー「qiqi_77_」の元の記事であり、CC 4.0BY-SA著作権契約に従います。元のソースリンクを添付してください。この文。
元のリンク：https：//blog.csdn.net/qiqi_77_/article/details/79456605
二分木順序深さトラバーサルおよびバックトラッキングアルゴリズム
* Definition for a binary tree node.
* function TreeNode(val) {
* this.val = val;
* this.left = this.right = null;
* }
*/
/**
* @param {TreeNode} root
* @return {string[]}
*/
var binaryTreePaths = function(root) {
var res = [],tmp = []; //res为结果，tmp保存每次递归已遍历过的节点值
dfs(root);
return res;
function dfs(root) {
if(root == null) { //空子节点需要return
return;
}
if(root != null && root.left == null && root.right == null) { //遇到叶子节点
tmp.push(root.val);
res.push(tmp.join('->'));
tmp.pop();
return;
}
tmp.push(root.val);
dfs(root.left);
dfs(root.right);
tmp.pop();
}
};
作者：chen-ke-jie-ryan
链接：https://leetcode-cn.com/problems/binary-tree-paths/solution/dfssi-lu-qing-xi-by-chen-ke-jie-ryan/
来源：力扣（LeetCode）
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。