ホームページ > 記事 > ウェブフロントエンド > フロントエンド JS の面接での基本的な質問 96 問 (回答を含む)
[関連する推奨事項: フロントエンド面接の質問]
1. いくつかの基本的な質問データ型? 複合データ型? 値型と参照データ型? スタック データ構造?
基本データ型: 未定義、Null、ブール、数値、文字列
値の型: 数値、ブール値、null、未定義。
参照型: オブジェクト、配列、関数。
スタックのデータ構造: 後入れ先出し (LIFO)、つまり後から挿入されたデータが先に取り出されるコレクションです!
js 配列には次のメソッドが用意されています。スタックの実装は簡単です。
shift: 配列から最初の要素を削除し、この要素の値を返します。
unshift: 1 つ以上の要素を配列の先頭に追加し、新しい長さを返します。
push: 要素を配列の末尾に追加し、新しい長さを返します。
pop: 配列から最後の要素を削除します。 array 要素を削除し、この要素の値を返します。
2. 関数の昇格の宣言? 変数の宣言と関数の宣言の違いは何ですか?
(1) 変数宣言の昇格: 変数宣言の前実行コンテキストが完成しました。
変数がコード内で宣言されている限り、どこで宣言されていても、JS エンジンはその宣言をスコープの先頭に配置します;
(2) 関数宣言のプロモーション: 実行関数宣言はコードの前に読み取られます。つまり、関数宣言をそれを呼び出すステートメントの後に配置できます。
関数がコード内で宣言されている限り、どこで宣言されているかに関係なく、JS エンジンはその宣言をスコープの先頭に配置します;
(3) 変数または関数の宣言: 関数宣言は変数宣言をオーバーライドしますが、変数の割り当てはオーバーライドしません。
同じ名前が a を識別します。つまり、変数宣言 var a と関数宣言 function a() {} があります。2 つの宣言の順序に関係なく、関数宣言は変数宣言を上書きします。つまり、このときの a の値は宣言された関数 function a() {} になります。注: 変数の宣言と同時に a が初期化された場合、または後で a に値が割り当てられた場合、その時点の a の値が変数の値になります。例: var a; var c = 1; a = 1; function a() { return true; } console.log(a);
3. データ型を決定しますか?
typeof によって返される型はすべて文字列の形式であり、関数の型を決定するために使用できます。Object 以外の型のオブジェクトを決定する方が便利です。
既知のオブジェクト タイプを決定するメソッド:instanceof、その後にオブジェクト タイプが続く必要があり、大文字と小文字を間違えることはできません。このメソッドは、条件付き選択または分岐に適しています。
4. 非同期プログラミング?
方法 1: コールバック関数。利点は、シンプルで理解しやすく、展開しやすいことです。欠点は、コードを読んだり保守したりしにくいことです。さまざまな部分高度に結合（Coupling）しているため、処理が非常に複雑になり、わかりにくく、タスクごとに指定できるコールバック関数は 1 つだけです。
方法 2: 時間監視。複数のイベントをバインドでき、各イベントは複数のコールバック関数を指定でき、モジュール化に役立つ「分離」 (デカップリング) できます。欠点は、プログラム全体をイベント駆動型にする必要があり、実行プロセスが非常に不明確になることです。
方法 3: パブリッシュ/サブスクライブ。本質的には「イベント リスニング」と似ていますが、明らかに後者よりも優れています。
メソッド 4: Promises オブジェクトは、非同期プログラミング用の統一インターフェイスを提供するために CommonJS ワーキング グループによって提案された仕様です。
簡単に言えば、各非同期タスクが Promise オブジェクトを返し、そのオブジェクトにはコールバック関数を指定できる then メソッドがあるということです。
5. イベント フロー? イベント キャプチャ?イベントが盛り上がってますか？
イベント フロー: ページからイベントを受信する順序。つまり、イベントが発生したとき、そのイベントが伝播するプロセスがイベント フローです。#6. タイマーをクリアするには?
IE のイベント ストリームはイベント バブリングと呼ばれます。イベント バブリング: イベントは最初に最も具体的な要素によって受信され、その後、より具体的ではないノード (ドキュメント) に上向きに伝播されます。 HTML の場合、要素がイベントを生成すると、そのイベントは親要素に渡され、親要素がイベントを受け取った後、引き続き上位要素に渡され、ドキュメントに伝播されます。オブジェクト (現在のブラウザーをウィンドウ オブジェクトに対して個人的にテストしました。IE8 以下のみがこのようなものではありません)
イベント キャプチャでは、あまり具体的でない要素がイベントをより早く受信し、最も具体的なノードが最後にイベントを受信する必要があります。その目的は次のとおりです。ターゲットに到達する前にイベントをキャプチャすること、つまりバブリング プロセスの逆です HTML のクリック イベントを例に取ると、ドキュメント オブジェクト (DOM レベルの仕様では伝播がドキュメントから開始される必要があります)ただし、現在のブラウザはドキュメントから開始します) ウィンドウ オブジェクト (ウィンドウ オブジェクトから始まる) が最初にクリック イベントを受け取り、次にイベントはイベントの実際のターゲットに到達するまで DOM ツリーに沿って下方向に伝播します。
window.clearInterval();
window.clearTimeout();
7. 本体に dom オブジェクトを追加するにはどうすればよいですか? innerHTML と innerText の違いは何ですか?
body.appendChild(dom element);
innerHTML: HTML タグを含む、オブジェクトの開始位置から終了位置までのすべてのコンテンツ。
innerText: 開始位置から終了位置までの内容ですが、Html タグは削除されています
5 つのウィンドウ オブジェクトと属性をそれぞれ簡単に説明します
Member オブジェクト
window.event window.document window .history
window.screen window.navigator window.external
Window オブジェクトのプロパティは次のとおりです:
window //ウィンドウ自体
window.self //このウィンドウを参照 window=window .self
window.name //ウィンドウに名前を付けます
window.defaultStatus //ウィンドウのステータスバー情報を設定します
window.location //URLアドレス、この属性を装備すると、新しいページを開くことができます
8. データ永続化テクノロジ (ajax)? ajax プロセスについて簡単に説明します
1) クライアントは js イベントを生成します
2) XMLHttpRequest オブジェクトを作成します
3) XMLHttpRequest Configure に応答します
4) AJAX エンジン経由で非同期リクエストを送信します
5) サーバーはリクエストを受信して処理し、HTML または XML コンテンツを返します
6)XML はコールバックを呼び出します( ) 応答コンテンツを処理します
7) ページの一部を更新
9. コールバック関数?
コールバック関数は、関数を通じて呼び出される関数です。ポインタ。関数ポインタ (アドレス) をパラメータとして別の関数に渡し、このポインタがそれが指す関数を呼び出すために使用される場合、それをコールバック関数と呼びます。コールバック関数は、関数の実装者によって直接呼び出されるのではなく、特定のイベントまたは条件が発生したときに、そのイベントまたは条件に応答するために別のパーティによって呼び出されます。
10. クロージャとは何ですか?* スタック オーバーフローとスタック オーバーフローの違いは何ですか?メモリ リーク?どのような操作がメモリ リークを引き起こす可能性がありますか?メモリリークを防ぐにはどうすればよいでしょうか?
クロージャ: 他の関数の内部変数を読み込むことができる関数です。11. 日常業務でデータをどのように操作するか? バックグラウンドでデータが提供されない場合はどのように開発すればよいですか? 模擬データがバックグラウンドから返される形式と一致しない場合はどうすればよいですか?
スタック オーバーフロー: スタックに割り当てられたローカル データ ブロックのサイズに関係なく、データ ブロックに書き込まれるデータが多すぎるため、データが範囲外になり、他のデータが上書きされます。再帰でよく起こります。
メモリ リークとは、動的ストレージを使用して関数メモリ領域を割り当て、使用後に解放されず、メモリ ユニットが常に占有されることを指します。プログラムが終了するまで。所有または必要がなくなった後も存続するオブジェクトを指します。
メモリ リークの原因:
setTimeout の最初のパラメータで関数ではなく文字列を使用すると、メモリ リークが発生します。
クロージャ、コンソール ログ、ループ (2 つのオブジェクトが相互に参照し、保持するとループが生成されます)
メモリ リークの防止:
1. イベントを動的にバインドしないでください;
2動的に追加または動的に削除される DOM にイベントをバインドしないでください。イベントを使用して親コンテナー内でバブルアップしてイベントをリッスンします。##3. 上記の原則に違反したい場合は、DOM に destroy メソッドを提供する必要があります。 DOM が削除されていることを確認してください。バックボーン イベントも削除されています。これについては、バックボーンのソース コードを参照してください。これはより良い方法です。#4. シングルトン化により、DOM の作成とイベント バインディングが少なくなります。
バックエンドはインターフェイス ドキュメントを作成し、データ インターフェイス実装を提供し、フロントエンドは Ajax アクセスを通じてデータ対話を実現します。
データをマッピングするためのマッピング ファイルを作成するときに返されるデータが均一ではありません。12 ajax 実行プロセスを簡単に説明します
基本步骤：var xhr =null;//创建对象
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();}else{
xhr = new ActiveXObject("Microsoft.XMLHTTP");}xhr.open(“方式”,”地址”,”标志位”);//初始化请求
xhr.setRequestHeader(“”,””);//设置http头信息
xhr.onreadystatechange =function(){}//指定回调函数
xhr.send();//发送请求
自己実行関数: 1. 匿名関数を宣言します。 2. 匿名関数をすぐに呼び出します。
14.html と xhtml の違いは何ですか?
利点: 変数がグローバルな世界に広がるのを防ぎ、さまざまな JS ライブラリとの競合を回避します。汚染を避けるためにスコープを分離するか、参照変数の解放を妨げるクロージャーを避けるためにスコープチェーンを切り詰めます。即時実行機能を利用して、必要なビジネス関数またはオブジェクトを返し、毎回条件判断に対処する必要を回避します。
シナリオ: 通常、フレームワークやプラグインなどのシナリオで使用されます
HTML は基本的な WEB Web ページのデザイン言語であり、XHTML は XML に基づくマークアップ言語です。
2.XHTML 要素は閉じている必要があります。15. コンストラクターとは何ですか?通常の関数との違いは何ですか?
3. タグ名には小文字を使用する必要があります。
4. 空のタグも閉じる必要があります。
5.XHTML ドキュメントにはルート要素が必要です。
构造函数：是一种特殊的方法、主要用来创建对象时初始化对象，总与new运算符一起使用，创建对象的语句中构造函数的函数名必须与类名完全相同。
与普通函数相比只能由new关键字调用，构造函数是类的标示
16. 通过new创建一个对象的时候，函数内部有哪些改变
function Person(){}Person.prototype.friend = [];Person.prototype.name = '';// var a = new Person();// a.friend[0] = '王琦';// a.name = '程娇';// var b = new Person();// b.friend？// b.name?
1、创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。
2、属性和方法被加入到 this 引用的对象中。
3、新创建的对象由 this 所引用，并且最后隐式的返回 this 。
17.事件委托？有什么好处?
（1）利用冒泡的原理，把事件加到父级上，触发执行效果
（2）好处：新添加的元素还会有之前的事件；提高性能。
18.window.onload ==? DOMContentLoaded ?
一般情况下，DOMContentLoaded事件要在window.onload之前执行，当DOM树构建完成的时候就会执行DOMContentLoaded事件，而window.onload是在页面载入完成的时候，才执行，这其中包括图片等元素。大多数时候我们只是想在DOM树构建完成后，绑定事件到元素，我们并不需要图片元素，加上有时候加载外域图片的速度非常缓慢。
19.节点类型?判断当前节点类型?
1. 元素节点
2. 属性节点
3. 文本节点
8. 注释节点
9. 文档节点
通过nodeObject.nodeType判断节点类型：其中，nodeObject 为DOM节点（节点对象）。该属性返回以数字表示的节点类型，例如，元素节点返回 1，属性节点返回 2 。
20.如何合并两个数组？数组删除一个元素?
//三种方法。 （1）var arr1=[1,2,3];
var arr2=[4,5,6];
arr1 = arr1.concat(arr2);
console.log(arr1);
（2）var arr1=[1,2,3];
var arr2=[4,5,6];
Array.prototype.push.apply(arr1,arr2);
console.log(arr1);
（3）var arr1=[1,2,3];
var arr2=[4,5,6];
for (var i=0; i < arr2.length; i++) {
arr1.push( arr2[i] );
}
console.log(arr1);21.强制转换 显式转换 隐式转换?
//强制类型转换： Boolean(0) // => false - 零 Boolean(new object()) // => true - 对象 Number(undefined) // => NaN Number(null) // => 0 String(null) // => "null" parseInt( ) parseFloat( ) JSON.parse( ) JSON.stringify ( )
隐式类型转换：
在使用算术运算符时，运算符两边的数据类型可以是任意的，比如，一个字符串可以和数字相加。之所以不同的数据类型之间可以做运算，是因为JavaScript引擎在运算之前会悄悄的把他们进行了隐式类型转换的
（例如：x+"" //等价于String(x)
+x //等价于Number(x)
x-0 //同上
!!x //等价于Boolean(x),是双叹号）
显式转换：
如果程序要求一定要将某一类型的数据转换为另一种类型，则可以利用强制类型转换运算符进行转换，这种强制转换过程称为显示转换。
显示转换是你定义让这个值类型转换成你要用的值类型，是底到高的转换。例 int 到float就可以直接转，int i=5,想把他转换成char类型，就用显式转换（char）i
22. Jq中如何实现多库并存?
Noconfict 多库共存就是“$ ”符号的冲突。
方法一： 利用jQuery的实用函数$.noConflict();这个函数归还$的名称控制权给另一个库，因此可以在页面上使用其他库。这时，我们可以用"jQuery "这个名称调用jQuery的功能。 $.noConflict();
jQuery('#id').hide();
.....
//或者给jQuery一个别名
var $j=jQuery
$j('#id').hide();
.....
方法二： (function($){})(jQuery)
方法三： jQuery(function($){})
通过传递一个函数作为jQuery的参数，因此把这个函数声明为就绪函数。 我们声明$为就绪函数的参数，因为jQuery总是吧jQuery对象的引用作为第一个参数传递，所以就保证了函数的执行。
23.Jq中get和eq有什么区别？
get() :取得其中一个匹配的元素。num表示取得第几个匹配的元素，get多针对集合元素，返回的是DOM对象组成的数组 eq():获取第N个元素，下标都是从0开始，返回的是一个JQuery对象
24.如何通过原生js 判断一个元素当前是显示还是隐藏状态?
if( document.getElementById("div").css("display")==='none')
if( document.getElementById("div").css("display")==='block')
$("#div").is(":hidden"); // 判断是否隐藏
$("#div").is(":visible")
25.Jq如何判断元素显示隐藏？
//第一种：使用CSS属性
var display =$('#id').css('display');
if(display == 'none'){ alert("我是隐藏的！"); }
//第二种：使用jquery内置选择器
<div id="test"> <p>仅仅是测试所用</p> </div>
if($("#test").is(":hidden")){
$("#test").show();
//如果元素为隐藏,则将它显现
}else{
$("#test").hide();
//如果元素为显现,则将其隐藏
}
//第三种：jQuery判断元素是否显示 是否隐藏
var node=$('#id');
if(node.is(':hidden')){ //如果node是隐藏的则显示node元素，否则隐藏
node.show();
}else{
node.hide();
}
26.移动端上什么是点击穿透?
点击穿透现象有3种：
点击穿透问题：点击蒙层（mask）上的关闭按钮，蒙层消失后发现触发了按钮下面元素的click事件跨页面点击穿透问题：如果按钮下面恰好是一个有href属性的a标签，那么页面就会发生跳转另一种跨页面点击穿透问题：这次没有mask了，直接点击页内按钮跳转至新页，然后发现新页面中对应位置元素的click事件被触发了
解决方案：
1、只用touch
最简单的解决方案，完美解决点击穿透问题
把页面内所有click全部换成touch事件（ touchstart 、’touchend’、’tap’）
2、只用click
下下策，因为会带来300ms延迟，页面内任何一个自定义交互都将增加300毫秒延迟
3、tap后延迟350ms再隐藏mask
改动最小，缺点是隐藏mask变慢了，350ms还是能感觉到慢的
4、pointer-events
比较麻烦且有缺陷， 不建议使用mask隐藏后，给按钮下面元素添上 pointer-events: none; 样式，让click穿过去，350ms后去掉这个样式，恢复响应缺陷是mask消失后的的350ms内，用户可以看到按钮下面的元素点着没反应，如果用户手速很快的话一定会发现
27.Jq绑定事件的几种方式？on bind ?
jQuery中提供了四种事件监听方式，分别是bind、live、delegate、on，对应的解除监听的函数分别是unbind、die、undelegate、off
Bind( )是使用频率较高的一种，作用就是在选择到的元素上绑定特定事件类型的监听函数;
Live( )可以对后生成的元素也可以绑定相应的事件,处理机制就是把事件绑定在DOM树的根节点上，而不是直接绑定在某个元素上;
Delegate( )采用了事件委托的概念，不是直接为子元素绑定事件，而是为其父元素（或祖先元素也可）绑定事件，当在p内任意元素上点击时，事件会一层层从event target向上冒泡，直至到达你为其绑定事件的元素；
on( )方法可以绑定动态添加到页面元素的事件，on()方法绑定事件可以提升效率；
28.Jq中如何将一个jq对象转化为dom对象？
方法一：
jQuery对象是一个数据对象，可以通过[index]的方法，来得到相应的DOM对象。
如：var $v =$("#v") ; //jQuery对象
var v=$v[0]; //DOM对象
alert(v.checked) //检测这个checkbox是否被选中
方法二：
jQuery本身提供，通过.get(index)方法，得到相应的DOM对象
如：var $v=$("#v"); //jQuery对象
var v=$v.get(0); //DOM对象
alert(v.checked) //检测这个checkbox是否被选中
29.Jq中有几种选择器?分别是什么?
层叠选择器、基本过滤选择器、内容过滤选择器、可视化过滤选择器、属性过滤选择器、子元素过滤选择器、表单元素选择器、表单元素过滤选择器
30.Jq中怎么样编写插件?
//第一种是类级别的插件开发：//1.1 添加一个新的全局函数 添加一个全局函数，我们只需如下定义：
jQuery.foo = function() {
alert('This is a test. This is only a test.'); }; //1.2 增加多个全局函数 添加多个全局函数，可采用如下定义：
jQuery.foo = function() {
alert('This is a test. This is only a test.'); }; jQuery.bar = function(param) {
alert('This function takes a parameter, which is "' + param + '".'); }; 调用时和一个函数的一样的:jQuery.foo();jQuery.bar();或者$.foo();$.bar('bar');//1.3 使用jQuery.extend(object);
jQuery.extend({
foo: function() {
alert('This is a test. This is only a test.');
},
bar: function(param) {
alert('This function takes a parameter, which is "' + param +'".');
}
}); //1.4 使用命名空间// 虽然在jQuery命名空间中，我们禁止使用了大量的javaScript函数名和变量名。// 但是仍然不可避免某些函数或变量名将于其他jQuery插件冲突，因此我们习惯将一些方法// 封装到另一个自定义的命名空间。jQuery.myPlugin = { foo:function() {
alert('This is a test. This is only a test.');
},
bar:function(param) {
alert('This function takes a parameter, which is "' + param + '".');
} }; //采用命名空间的函数仍然是全局函数，调用时采用的方法：
$.myPlugin.foo(); $.myPlugin.bar('baz');//通过这个技巧（使用独立的插件名），我们可以避免命名空间内函数的冲突。//第二种是对象级别的插件开发//形式1：
(function($){
$.fn.extend({
pluginName:function(opt,callback){
// Our plugin implementation code goes here.
}
}) })(jQuery); //形式2：(function($) {
$.fn.pluginName = function() {
// Our plugin implementation code goes here.
}; })(jQuery);//形参是$，函数定义完成之后,把jQuery这个实参传递进去.立即调用执行。//这样的好处是,我们在写jQuery插件时,也可以使用$这个别名,而不会与prototype引起冲突
31.$('p+.ab')和$('.ab+p') 哪个效率高？
$('p+.ab')效率高
32.$.map和$.each有什么区别
map()方法主要用来遍历操作数组和对象，会返回一个新的数组。$.map()方法适用于将数组或对象每个项目新阵列映射到一个新数组的函数；
each()主要用于遍历jquery对象，返回的是原来的数组，并不会新创建一个数组。
33.编写一个 getElementsByClassName 封装函数?
<body> <input type="submit" id = "sub" class="ss confirm btn" value="提交"/> <script> window.onload = function(){ //方法一
var Opt = document.getElementById('sub');
var getClass = function(className,tagName){
if(document.getElementsByTagName){
var Inp = document.getElementsByTagName(tagName);
for(var i=0; i<Inp.length; i++){
if((new RegExp('(\\s|^)' +className +'(\\s|$)')).test(Inp[i].className)){
return Inp[i];
}
}
}else if(document.getElementsByClassName){
return document.getElementsByClassName(className);
}
} //方法二 var aa = getClass("confirm", "input");
function getClass(className, targetName){
var ele = [];
var all = document.getElementsByTagName(targetName || "*");
for(var i=0; i<all.length; i++){
if(all[i].className.match(new RegExp('(\\s|^)'+confirm+'(\\s|$)'))){
ele[ele.length] = all[i];
}
}
return ele;
}//方法三 function getObjsByClass(tagName, className){
if(document.getElementsByClassName){
alert("document.getElementsByClassName");
return document.getElementsByClassName(className);
}else{
var el = [];
var _el = document.getElementsByTagName(tagName);
for(var i=0; i<_el.length; i++){
if(_el[i].className.indexOf(className) > -1){
alert(_el[i]);
el[_el.length] = _el[i];
}
}
alert(el);
return el;
}
}
}
</script></body>
34.简述下工作流程
前の会社での私の仕事の流れは、社内での最終決定会議の後、簡単な技術的な打ち合わせが行われ、その後フロントエンドが技術的な事前準備を行うという流れでした。フロントエンド カッターは PSD デザイン ドラフトを切り取り、CSS ファイルを統合します。私たちは主に JS 部分を書きます。これには、フロントエンド フレームワーク (大規模プロジェクト) の構築、JS ビジネスとデータ永続化操作の記述が含まれます。また、JS プラグインを記述して使いやすいようにカプセル化し、JS フロントエンド コンポーネントを記述します。最後に、完成した JS 部分をカッターが提供する HTML ページと統合します。最後に、完成したページで機能テスト、ページの互換性、および製品の復元を実行します。その後、製品は密封され、テストに提出されます。バグが発生した場合は、修正のために開発者に返却され、テストのために送信され、最終的にテストが成功すると、バージョンがアーカイブされます。オンライン テストを実行するには、すべてのプログラムがオンラインになるまで待ちます。
35. どのようなバージョン管理ツールが一般的に使用されますか? svn はどのようにファイルをロックしますか?
svn ロックの目的: 複数の人が同じファイルを変更するのを防ぐためです。同時に、お互いをカバーするには、バージョン管理システムに競合処理メカニズムが必要です。
svn ロックの 2 つの戦略: オプティミスティック ロック: チェックアウトされたすべてのファイルは読み取りおよび書き込み可能です。ファイルへの変更にはファイル ロックを取得する必要はありません。ファイルを変更した後にチェックインすると、最初にローカル ファイルを更新するために必要です。バージョン管理システムはローカルの変更を上書きしませんが、競合をマージしてチェックインすることはできます。
厳密なロック: チェックアウトされたファイルはすべて読み取り専用です。ファイルを変更する場合は、ファイルのロックを取得する必要があります。他の人がファイルをロックしていない場合、バージョン管理システムがそのファイルを許可します。 . ファイルをロックし、ファイルを編集可能にします。
svn の 2 つのロック手順: オプティミスティック ロック: ロックするファイルを選択し、メニューを右クリックして [TortoiseSVN] をクリックして [ロックの取得] を選択します。
厳密なロック: 厳密にロックするファイルまたはディレクトリを右クリックし、TortoiseSVN プロパティ メニューを使用して、[新しいプロパティ] をクリックし、必要なロックを選択します。
36. git と svn の違いは何ですか?
SVN は集中バージョン管理システムであり、バージョン ライブラリは中央サーバーに集中されています。全員が自分のコンピュータを使用しているため、まず中央サーバーから最新バージョンを取得して作業を行い、作業が完了したら、行った作業を中央サーバーにプッシュする必要があります。集中バージョン管理システムが動作するには、インターネットに接続する必要があります。ローカル エリア ネットワーク上にある場合は問題ありません。帯域幅が十分に大きく、速度も十分に速いです。インターネット上にある場合は、ネットワークが速度が遅いと混乱してしまいます。
Git は分散バージョン管理システムであるため、中央サーバーがありません。みんなのコンピューターは完全なバージョン ライブラリです。この方法では、作業中にインターネットに接続する必要はありません。バージョンはすべてコンピュータ上にあります。全員のコンピュータには完全なバージョンのライブラリがあるため、複数人で共同作業を行うにはどうすればよいでしょうか?たとえば、あなたがコンピュータ上のファイル A を変更し、他の人もあなたのコンピュータ上のファイル A を変更した場合、お互いに変更をプッシュするだけで、お互いの変更を確認できます。
37. jquery と zepto の違いは何ですか?
1. モバイル プログラムの場合、Zepto にはタッチ スクリーン操作に使用できるいくつかの基本的なタッチ イベントがあります (タップ イベント、スワイプ インシデント)、Zepto は IE ブラウザをサポートしていません。これは、Zepto 開発者の Thomas Funks がクロスブラウザの問題で混乱したからではなく、ファイル サイズを削減するために慎重に検討した結果行われた決定です。jQuery チームのようにバージョン 2.0 では、古いバージョンの IE (6 7 8) はサポートされなくなりました。 Zepto は jQuery 構文を使用するため、ドキュメントでは IE のフォールバック ライブラリとして jQuery を推奨しています。そうすれば、プログラムは IE で引き続き実行でき、他のブラウザでも Zepto のファイル サイズの利点を享受できます。ただし、2 つの API には完全な互換性がないため、この方法を使用する場合は注意し、十分な調査を行ってください。
2. Dom 操作の違い: id の追加時に jQuery は有効になりませんが、Zepto は有効になります。
3.zepto は主にモバイル デバイスで使用され、新しいブラウザのみをサポートしていますが、コード サイズが比較的小さく、パフォーマンスが優れているという利点があります。
jquery は主に互換性が高く、様々な PC や携帯電話で動作し、様々なブラウザに対応しているのが利点ですが、コード量が多く、互換性を考えると性能が十分ではないのが欠点です。
38. $(function(){}) と window.onload と $(document).ready(function(){})
window.onload: 外部参照ファイル、画像などを含むページのすべての要素が読み込まれるときに、関数内で関数を実行するために使用されます。 loadメソッドは一度しか実行できず、jsファイル内に複数記述した場合は最後のもののみ実行可能です。
$(document).ready(function(){}) と $(function(){}) はどちらも、ページの標準 DOM 要素が DOM ツリーに解析された後に内部関数を実行するために使用されます。この関数は js ファイル内で複数回記述することができ、すべての動作関数が実行されるため、複数人で作成した js には大きな利点があります。さらに、$(document).ready() 関数は HMTL 構造のロード後に実行できるため、実行前に大きなファイルのロードや存在しない接続などの時間のかかる作業が完了するのを待つ必要がありません。非常に効率的です。
39. Jq の attr と prop の違いは何ですか
HTML 要素自体の固有属性については、処理時に prop メソッドを使用します。
HTML 要素の独自のカスタム DOM 属性の場合、処理時に attr メソッドを使用します。
40. プロパティやメソッドを定義する場合と、プロトタイプを定義する場合の違いを簡単に説明します。
これは現在のオブジェクトを表します。これがグローバル スコープで使用される場合は、現在のページ オブジェクト ウィンドウを参照します。これが関数で使用される場合、これが参照するものはランタイムに基づきますこの関数のどのオブジェクトが呼び出されるのか。また、2 つのグローバル メソッド apply と call を使用して、関数内の this の特定のポインタを変更することもできます。
プロトタイプは本質的には JavaScript オブジェクトです。そして、すべての関数にはデフォルトのプロトタイプ属性があります。
プロトタイプで定義された属性メソッドは、すべてのインスタンスで共有されます。すべてのインスタンスは同じオブジェクトを参照します。単一のインスタンスによってプロトタイプの属性を変更すると、他のすべてのインスタンスにも影響します。
41. プリコンパイル済み音声 | プリコンパイル済みプロセッサとは何ですか?
Sass は、CSS コードをプログラム的に生成する CSS プリプロセッサ言語です。プログラマブルなので制御の柔軟性や自由度が高く、CSSコードを直接記述するのが難しい一部のコードも簡単に実装できます。
同時に、Sass は CSS を生成する言語であるため、記述した Sass ファイルをそのまま使用することはできず、コンパイラーで CSS ファイルにコンパイルしてから使用する必要があります。
CSS プリプロセッサは、ブラウザの互換性の問題を考慮せずに、CSS にいくつかのプログラミング機能を追加するために使用される言語です。たとえば、CSS で変数、単純なプログラム ロジック、関数などを使用できます。プログラミング言語の基本的なスキルCSS をより簡潔にし、適応性を高め、コードをより直感的にすることができるなど、多くの利点があります。最も一般的に使用される CSS プリプロセッサは、sass、less css、および stylus です。
42.ajax と jsonp?
ajax と jsonp の違い:
類似点: どちらも URL をリクエストします
相違点: ajax の中核は、xmlHttpRequest を通じてコンテンツを取得することです
jsonp の中核は動的です