【前端】筆試題 2019.08.09

選擇題：HTML+CSS+JS
參考鏈接：https://www.nowcoder.com/
非商業用途自由轉載，保持署名，註明出處！

---

1.塊內聲明函數的做法？不要在塊內聲明一個函數（嚴格模式會報語法錯誤）。如果確實需要在塊中定義函數，可以使用函數表達式來聲明函數；

if (x) {  var foo = function() {}}

2.js

var x = new Boolean(false);
if (x) {
  alert('hi');
}
var y = Boolean(0);
if (y) {
  alert('hello'); 
}

//hi

• 任何對象轉爲布爾值，都爲得到 true（在 JS 中，只有 0，-0，NaN，""，null，undefined 這六個值轉布爾值時，結果爲 false）。

3.js

var c;
console.log(c);
(function() {
      var a = b = 5;
  })();   
console.log(b);
console.log(a);

//5，Uncaught ReferenceError: a is not defined

• 找到了，未賦值才顯示undefined；找不到則報錯？
• (function(){})();爲自執行函數

4.js全局函數

• setTimeout是window的一個方法，如果把window當做全局對象來看待的話，它就是全局函數。嚴格來講，它不是
  

5.head 標籤中必不少的是< title>，其他均可省
6.假設 output 是一個函數，輸出一行文本。下面的語句輸出結果是什麼？

output(typeof (function() {output(“Hello World!”)})());//Hello World! undefined

7.sort排序函數：https://www.cnblogs.com/saifei/p/9043821.html

• 排序是按照字符串UniCode碼的順序進行排序的，數字也是
• 原理：若 a 小於 b，即 a - b 小於零，則返回一個小於零的值，數組將按照升序排列；否則降序。
• 升序函數

function numberSort(a,b)
{
return a - b;
}
var arr=new Array("23","6","12","35","76");
document.write(arr.sort(numberSort));

• 降序函數

function numberSort(a,b)
{
return b-a;
}
var arr=new Array("23","6","12","35","76");
document.write(arr.sort(numberSort));

8.JavaScript內部，所有數字都是以64位浮點數（8字節）形式儲存，即使整數也是如此
9.HTML5 中，哪個方法用於獲得用戶的當前位置？getCurrentPosition()

• HTML5是語義化標籤，儘量從語義考慮

10.H5新增標籤：

• article: 標籤定義外部的內容。
• aside:標籤定義 article 以外的內容。a
• audio:h5新增音頻標籤。沒有高寬屬性
• canvas:h5新增畫布標籤。
• command: 定義命令按鈕(未測試)
• datalist：標籤定義選項列表。datalist 及其選項不會被想顯示出來，它僅僅是合法的輸入值列表
• details：標籤用於描述文檔或文檔某個部分的細節。
• figure：標籤用於對元素進行組合。
• figcaption：定義 figure 元素的標題。
• footer：定義 section 或 document 的頁腳。
• header：定義 section 或 document 的頁眉。
• hgroup：用於對網頁或區段（section）的標題進行組合。
• keygen:標籤規定用於表單的密鑰對生成器字段
• mark：標籤定義帶有記號的文本。
• meter：通過min=“0” max="20"的方式定義度量衡。僅用於已知最大和最小值的度量。
• nav：定義document或section或article的導航。
• output：定義不同的輸出類型，比如腳本。
• progress：定義任何類型的任務的進度。
• rp:定義若瀏覽器不支持 ruby 元素顯示的內容
• rt：定義 ruby 註釋的解釋
• ruby：定義 ruby 註釋
• section：標籤定義文檔中的節、區段。比如章節、頁眉、頁腳或文檔中的其他部分
• source:audio和video的屬性之一。爲audio和video定義媒介源。
• summary:爲details定義標題。
• time:定義日期或時間。
• video：h5新增視頻標籤。具有高寬屬性。

-----------------------------------------------------------------------------------------------------------------

11.CSS3新增屬性用法整理：http://blog.sina.com.cn/s/blog_a01a36330101doc0.html

• box-shadow（陰影效果）
• border-color（爲邊框設置多種顏色）
• border-image（圖片邊框）
• text-shadow（文本陰影）
• text-overflow（文本截斷）
• word-wrap（自動換行）
• border-radius（圓角邊框）
• opacity（透明度）
• box-sizing（控制盒模型的組成模式）
• resize（元素縮放）
• outline（外邊框）
• background-size（指定背景圖片尺寸）
• background-origin（指定背景圖片從哪裏開始顯示）
• background-clip（指定背景圖片從什麼位置開始裁剪）
• background（爲一個元素指定多個背景）
• hsl（通過色調、飽和度、亮度來指定顏色顏色值）
• hsla（在hsl的基礎上增加透明度設置）
• rgba（基於rgb設置顏色，a設置透明度）

12.js

var F=function(){};
Object.prototype.a=function(){};
Function.prototype .b=function(){};
var f=new F();

//f能取到a，但取不到b,所有普通對象都源於這個Object.prototype對象，只要是對象，都能訪問到a

13.ES6:function 後面帶 * 的叫做generator function。函數運行時，返回一個迭代器

function * gen() {
    yield 1;
    yield 2;
    yield 3;
}

14.當用戶打開一個網頁時，想一直停留在當前打開的頁面，禁止頁面前進和後退的命令是：

window.history.forward(1);
window.history.forward(-1);

15.屬於JavaScript的typeof運算符的可能結果：Number、String、Undefined、Symbol、Boolean

• null的typeof返回的是object，這是個javascript的歷史bug

16.DNS:

• 將域名翻譯成IP地址。
• DNS協議大多數運行在UDP協議之上
• DNS協議端口號爲53
• chrome對每個域名會默認緩存60s；IE將DNS緩存30min；Firefox默認緩存時間只有1分鐘；Safari約爲10S。

17.常見的瀏覽器端的存儲技術:

• cookie:
• localStorge: 存的更多，獲取更方便，而且存儲內容不會隨請求發送給服務器
• IE 支持 userData 存儲數據，但是基本很少使用到

18.hr也是塊級元素
19.按鈕button id爲button1，通過原生的js如何禁用？

document.getElementById(“button1”).setAttribute(“disabled”,”true”);
document.getElementById(“button1”).disabled=true;

20.若需給子scope發送消息，需使用哪個方法？broadcast()

//$emit() 是向上冒泡！而$ broadcast() 是向下傳播事件 

-----------------------------------------------------------------------------------------------------------------

21.表單中包含文件上傳控件時

• 需要將enctype設置爲multipart/form-data.
• enctype 屬性規定在發送到服務器之前應該如何對錶單數據進行編碼。
• 屬性值：application/x-www-form-urlencoded 在發送前編碼所有字符（默認）
• multipart/form-data ：不對字符編碼。 在使用包含文件上傳控件的表單時，必須使用該值。
• text/plain ：空格轉換爲 “+” 加號，但不對特殊字符編碼。

22.模塊化：

• sea.js----CMD；require.js—AMD（記憶：CS,AR）
• AMD推崇依賴前置，CMD推崇依賴就近

23.HTML:

<div id=”info” style=”display:block”><p> 請填寫 </p></div>

js：

document.getElementById(“info”).innerHTML 

innerHTML 屬性設置或返回表格行的開始和結束標籤之間的 HTML。
返回：

<p>請填寫</p>

24.js：

var x=10;
function cals(myNum) {
            return x+myNum;
        }

返回： cals(7)=17

25.display：

• display:block
• display:inline：內聯元素只能容納文本或者其他內聯元素，它允許其他內聯元素與其位於同一行，但寬度(width)高度(height)不起作用。常見內聯元素爲“a”
• display:inline-block

26.input中type：

27.解釋型語言的特性有什麼？非獨立，效率低！
28.display:none在隱藏元素的時候，將其佔位空間也去掉；而visibility:hidden只是隱藏了內容而已，其佔位空間仍然保留。且均符合HTML5標準
29.實現翻書的效果可以使用css3裏的什麼方法？rotateY（沿y軸旋轉）！而translateY沿y軸平移
30.只有IE支持defer模塊

-----------------------------------------------------------------------------------------------------------------

31.avaScript實現繼承共6種方式：
原型鏈繼承、借用構造函數繼承、組合繼承、原型式繼承、寄生式繼承、寄生組合式繼承。
32.在準備XMLHttpRequest對象時，在send()前需要調用哪個方法？open ()
33.在jquery中，如果想要獲取當前窗口的寬度值，下面哪個是實現該功能的？width()
34.js

if(! "a" in window){
    var a = 1;
}
alert(a);//undefined

但是由於變量的提前聲明，以上代碼與如下代碼等價：

var a；
if（！“a” in  window ）{
    a=1;
}
alert(a);

35.在HTML中，（ ）可以在網頁上通過鏈接直接打開郵件客戶端發送郵件。

<a href=”mailto:[email protected]”>發送郵件</a>

36.js

首先全部輸出first，然後全部輸出second.因爲JavaScript 是單線程的，setTimeout 設置的是異步任務等其他代碼執行，所以這裏會等待 for 循環執行完畢纔會執行定時器設置的任務。

37.表單提交時會觸發什麼Dom方法？submit
38.var arr =[1,3,2]下，輸出：

arr.push(3);//返回長度4，arr改變了
arr.reverse()；//報錯，arr改變了
[].concat.call(arr,[1,2])；//返回新數組，arr並未改變
arr.sort();//報錯；arr改變了

39.DOM中的事件對象：

• preventDefault() 取消事件默認行爲
• stopImmediatePropagation() 取消事件冒泡同時阻止當前節點上的事件處理程序被調用。
• stopPropagation() 取消事件冒泡對當前節點無影響。
  IE中的事件對象：
• cancelBubble() 取消事件冒泡
• returnValue() 取消事件默認行爲
  40.哪個標籤告訴瀏覽器把其中的文本表示爲強調的內容？< em></ em>

-----------------------------------------------------------------------------------------------------------------

41.繼承就是指子節點默認使用父節點的樣式屬性。
可以繼承的屬性很少，只有顏色，文字，字體間距行高對齊方式，和列表的樣式可以繼承。

• 所有元素可繼承：visibility和cursor。
• 內聯元素可繼承：letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。
• 終端塊狀元素可繼承：text-indent和text-align。
• 列表元素可繼承：list-style、list-style-type、list-style-position、list-style-image。

42.標題的標籤到h6爲止
43.代碼回收規則：

• 全局變量不會被回收。
• 局部變量會被回收，也就是函數一旦運行完以後，函數內部的東西都會被銷燬。
• 只要被另外一個作用域所引用就不會被回收？
• 閉包中的局部變量是不會被回收的

var i = 1;
var i = 2;//覆蓋上一個i，全局，不會被回收
var add = function() {//add，全局，不會
    var i = 0;
    return function()
{
        i++;//閉包，不會
        console.log(i);
    }
}();
add();

-----------------------------------------------------------------------------------------------------------------

---

如有不當之處，歡迎指正！