cocoscreator面試題集錦 第一篇 Cocos creator部分 遊戲開發部分

公衆號 亮亮同學TT
cocoscreator 版本：2.4.x

js/ts 遵循es6標準

第一篇

Javascript部分

• Javascript有哪些數據類型？ 舉例兩個最常見的內置對象數據類型。
  【答案】Number, String, Boolean, Null, Undefined, Object
  常見內置對象類型：數組，函數

• 如下一段代碼：

var a = [];
a[100] = 1;
console.log(a.length);
console.log(a[0]);
a[200] = undefined;
console.log(a.length);
console.lolg(a['100']);

請問四條log語句分別輸出什麼？
【答案】分別輸出 101，undefined, 201，1

• parseInt('1.9'); parseInt('hello')分別返回什麼值？
  【答案】分別返回 1, NaN

• null和undefined的區別。
  【參考答案】null表示一個“空”的值，它和0以及空字符串''不同，0是一個數值，''表示長度爲0的字符串，而null表示“空”。在其他語言中，也有類似JavaScript的null的表示，例如Java也用null，Swift用nil，Python用None表示。但是，在JavaScript中，還有一個和null類似的undefined，它表示“未定義”。
  JavaScript的設計者希望用null表示一個空的值，而undefined表示值未定義。大多數情況下，我們都應該用null。undefined僅僅在判斷函數參數是否傳遞的情況下有用。

• ==和===的區別
  【參考答案】==在比較的時候可以自動轉換數據類型。===嚴格比較，不會進行自動轉換，要求進行比較的操作數必須類型一致，不一致時返回flase。

• 函數中this指向什麼？ call, apply, bind的用法和區別。
  【參考答案】this指代函數的運行環境，執行obj.func()時，this指向obj，直接執行func()時，this指向全局環境。
  call, apply, bind都可以改變函數執行時的運行環境，即this的指向。
  call和apply都是調用時立刻執行的，而bind調用後返回了綁定this對象的原函數，bind比較適合將this綁定後的函數傳入到其他函數中去執行，特別是作爲回掉函數異步執行。
  call和bind的參數第一個參數是要綁定的對象，後面是要傳入原函數的多個參數；而apply第二個參數必須是一個數組，數組中是要傳入的參數。

• 說說對 prototype和 __proto __ 的理解
  【參考答案】prototype是函數纔有的屬性，prototype本身也是個函數對象；__proto __是所有對象都有的屬性，__proto __指向構造它的對象的對象的prototype。例如：

> var o = new Object()
o.__proto__ == Object.prototype
< true

o是Object構造出的對象，o的__proto __指向Object的prototype，這樣o可以使用Object.prototype裏面的方法。原型鏈：當js查找對象的屬性時，先查找對象自身是否具有該屬性，如果沒有，就會去__proto __指向的prototype對象上查找，直到找到或者__proto __爲null

• 使用構造函數實現一個類Foo，需要有屬性 count, 方法bar(), 並且寫出創建該類對象的方法
  【參考答案】

function Foo(){
  this.count = 0;
}

Foo.prototype.bar = function(){
}

var foo = new Foo();
foo.bar();

• 以下代碼片段輸出是什麼，爲什麼？如果想輸出0,1,2請問如何修改？

var s = [];
function foo() {
    for(var i=0; i<3; i++){
            s[i] = function(){
                  console.log(i);
            }
    }
}
foo();
s[0]();
s[1]();
s[2]();

【參考答案】輸出3,3,3。因爲foo()函數執行時生成了三個閉包，這三個閉包綁定了同一個變量i，第三個閉包生成時，i的值爲3。因此執行這三個閉包時都會輸出3。
修改爲輸出0,1,2的原則是讓三個閉包綁定不同的變量，所以在生成閉包時就要區分出來，一種修改方法如下：

let s = [];
function foo() {
    for(let i=0; i<3; i++){
            s[i] = function(){
                  console.log(i);
            }
    }
}
foo();
s[0]();
s[1]();
s[2]();

• 說說ES6爲什麼要引入let關鍵字
  【參考答案】因爲要解決var聲明對象產生的問題。
  var是函數級作用域，而let是塊作用域。
  var存在變量提升，即變量可以在聲明之前使用，值爲undefined，而let聲明的變量如果在聲明之前使用會拋出一個錯誤。
  另外let不允許重複聲明變量。
  ES6 規定暫時性死區和let、const語句不出現變量提升，主要是爲了減少運行時錯誤，防止在變量聲明前就使用這個變量，從而導致意料之外的行爲。這樣的錯誤在 ES5 是很常見的，現在有了這種規定，避免此類錯誤就很容易了。

Cocos creator部分

• cocos creator和cocos2dx的區別
  【參考答案】cocos creator是一套包含編輯器在內的開發框架，其內部引擎使用了cocos2d-x js的精簡修改版本。creator使用js/ts語言開發，以內容創作爲核心，腳本作爲自定義組件添加到場景的節點上。

• creator中需要動態載入的資源，放在工程的哪個子目錄中
  【參考答案】asserts/resources

• 寫出代碼片段：獲取節點node上Label組件，並設置其內容爲'hello'
  【參考答案】

let label = node.getComponent(cc.Label);
label.string = 'hello';

• 列舉出組件的生命週期回掉函數，並說明其調用時機
  【參考答案】

onLoad   組件首次激活時觸發
start    組件第一次執行update之前觸發
update     每一幀渲染前調用
lateUpdate 所有組件update調用後調用
onDestroy  組件或所在節點調用了destroy()時調用，並在當前幀結束時統一回收組件
onEnable  組件的enabled屬性從false變爲true時
onDisable  組件的enabled屬性從true變爲false時

• creator對齊UI控件使用什麼組件？如果想製作一個和屏幕大小一樣的節點如何設置該組件
  【參考答案】widget組件。設置top,bottom,left,right爲0px，且該節點從直接的父節點到場景根節點都必須有widget組件且設置爲同屏幕大小。或者1.10之後可設置target爲最上層的節點。

• 寫一小段代碼，使用action將節點node在1秒鐘之內從當前位置移動到(100,100)
  【參考答案】

cc.tween(node)
.to(1,{position:cc.v2(100,100)})
.start()

遊戲開發部分

• 什麼是draw call? 爲什麼減少draw call可以優化遊戲速度。如何減少draw call? 在creator中如何做
  【參考答案】
  1）Draw Call 簡稱 ”繪製調用“
  就是CPU調用圖形繪製接口(api)（例如OpenGL中的glDrawElement命令。）來命令GPU進行圖形繪製(渲染)的操作。

2）在每次調用Draw Call之前，CPU需要向GPU發送很多內容，包括數據，狀態，命令等。在這一階段，CPU需要完成很多工作，例如檢查渲染狀態等。而一旦CPU完成了這些準備工作，GPU就可以開始本次的渲染。GPU的渲染能力是很強的，渲染300個和3000個三角網格通常沒有什麼區別，因此渲染速度往往快於CPU提交命令的速度。如果Draw Call的數量太多，CPU就會把大量時間花費在提交Draw Call命令上，造成CPU的過載。

因此造成Draw Call性能問題的是CPU。
3）解決辦法是 儘可能合批處理 即將小的dc 合併成大的dc 。
1，將碎圖 合併成大圖
1），靜態合圖
2），動態合圖
3），textuepaker打包圖集

注意：
1， 儘量將處於同一界面（UI）下的相鄰且渲染狀態相同的碎圖 打包成圖集
2，改變渲染狀態會打斷渲染合批，例如改變紋理狀態（預乘、循環模式和過濾模式）或改變 Material（材質）、Blend（混合模式）等等，所以使用自定義 Shader 也會打斷合批。

3,合理控制圖集最大尺寸，避免單個圖像加載時間過長。
4,尺寸太大的圖像沒有必要打進圖集（如背景圖）而且圖像尺寸越大，加載的時間也越長，而且是非線性的那種增長，例如加載一張圖像比加載兩張圖像所消耗的時間還長。，得不償失。
5, 間距保持默認的 2 並保持勾選擴邊選項，避免圖像裁剪錯誤和出現黑邊的情況。

2，label用bmfont位圖

• 一張1024x1024,32位的貼圖，在內存裏面佔多少字節？
  【參考答案】
  圖像佔用內存的公式是：numBytes = width * height * bitsPerPixel / 8

套用公式，RGBA8888 是32位
1024102432/8 = 4194304(字節）
4194304/1024/1024 = 4M ,
1024*1024 RGBA8888 圖片加載到內存的大小 = 4M

• cocos中sprite的Blend屬性，Src Blend Factor設置爲 SRC_ALPHA, Dst Blend Factor設置爲 ONE_MINUS_SRC_ALPHA是什麼意思，有什麼作用？
  【參考答案】這表示繪製這個Sprite時，和Frame buffer上面已經有的像素進行混合的公式參數。以上參數設置的公式爲: FinalColor = SpriteColor(RGB) * SpriteAlpha + BufferColor(RGB) * (1-SpriteAlpha)。效果是標準的透明圖元渲染。

• 如果做一個射擊遊戲，需要發射大量的子彈，爲了避免頻繁的申請內存，一般會採取什麼方法？這個機制會提供哪些接口供遊戲邏輯使用。
  【參考答案】會採用對象池/內存對象緩存的機制。一個對象池一般會提供, preAllocat(count)接口預先分配一定數量的對象， get()接口返回一個池裏面的空閒對象，put(obj)接口將對象返回到池裏面，freeAll()/Clear()接口清空整個對象池，釋放所有的內存。