使用 Google Apps Script 開發網頁應用/語法
Ajax 代表“非同步 JavaScript 和 XML”,它使網頁能夠在不重新載入頁面的情況下與伺服器通訊。
在 Google Apps Script 中,可以使用 google.script.run 工具來實現。此命令有多種變體,可以在 Google 伺服器上執行 JavaScript 程式碼,並可能將資訊返回到網頁。
例如,如果您想將姓名傳送到伺服器,然後檢查它是否在電子表格中,並返回 true 如果存在,返回 false 如果不存在,您可以將其設定為變數,您可以這樣做
首先是伺服器端程式碼
function doGet(){
var t=HtmlService.createFileFromTemplate("main");
return t.evaluate();
}
function runOnServer(name){
return checkInSpreadsheet(name); // this would be a function you'd write to check the spreadsheet
}
現在是“main.html”中包含您要執行的 JavaScript 的部分
google.script.withSuccessHandler(dealWithReturn).runOnServer("Andy");
function dealWithReturn(e){
if(e) {
alert("yep that name's in there");
} else {
alert("nope, that name's not in there");
}
流程是:主 JavaScript -> 伺服器上的函式 -> 將資料返回到您的 SuccessHandler -> 您的 successHandler 執行某些操作。
一個簡單(而且可以原諒)的錯誤是在將資料在 Google 表格和 JavaScript 之間來回移動時,陣列編號發行人會導致行或列偏移。JavaScript 從零開始編號,而 Google 表格從 1 開始編號。以下是一個示例
var coolArray=[1,2,3,5,7,11]; // why not 9? because it's not prime!
var myCoolSheet = SpreadsheetApp.getActive().getSheetByName("my cool sheet");
// this is a dumb way to put data into a sheet but it points out the numbering difference
coolArray.forEach((item,i)=>{
// myCoolSheet.getRange(i,1).setValue(item); this fails
myCoolSheet.getRange(i+1,1).setValue(item); // this works
}) // don't forget to close everything
如果您需要篩選陣列,請使用,嗯,filter
var people = [{name: "Andy", age: 48}, {name: "Ash", age: 20}, {name: "Char", age: 18}];
// get people under 30:
var youngPeople = people.filter(person=>person["age"]<30) // note that "person" didn't need to be initialized
與 查詢、forEach 和 對映 一樣,您也可以使用索引,如果您願意
var people = [{name: "Andy", age: 48}, {name: "Ash", age: 20}, {name: "Char", age: 18}];
// get people under 30 but not those with an index less than 2
var youngPeople = people.filter((person,i)=>person["age"]<30&&i>=2) // note that "person" didn't need to be initialized
如果您需要在陣列中查詢元素,find 非常有用
var array=[{name: "Andy", age: 48}, {name: "Ash", age: 20}]; // an array of objects
var ashObject = array.find(person=>person["name"]=="Ash"); // returns the first element that gives "true" for the check
如果您需要遍歷陣列並對每個元素執行操作,您可以當然這樣做
var array=["apple", "orange", "banana"];
for (var i=0; i<array.length; i++) {
doSomethingCool(array[i]);
}
但您也可以這樣做,我認為它更易讀
var array=["apple", "orange", "banana"];
array.forEach(fruit=>doSomethingCool(fruit));
請注意,您不必以這種方式初始化“i”變數。
如果您需要訪問專案(水果)及其在陣列中的位置(索引)
var array=["apple", "orange", "banana"];
array.forEach((fruit,i)=>doSomethingElseCool(fruit,i));
請注意 fruit, i 周圍的括號,它們使這種魔法起作用。還要注意,您仍然不必宣告 i 變數!
如果您要檢視陣列是否包含特定元素,請嘗試 includes
var myArray=["apple", "orange", "banana"];
if(myArray.includes("green beans")) {
// do something to say that green beans isn't in the array
}
與 forEach 類似,map 是一個很棒的方法,可以基於現有陣列建立新陣列。假設您想在陣列中的一些文本週圍新增一個標籤
var array=["apple", "orange", "banana"];
var newarray = array.map(fruit=>`<b>${fruit}</b>`)
您也可以輕鬆訪問陣列中專案的索引
var array=["apple", "orange", "banana"];
var newarray = array.map((fruit,i)=>`${fruit} is at index ${i} in the array`)
對陣列進行排序非常有價值,有時也很痛苦。假設您有一個來自電子表格的二維陣列,其中包含“姓名”、“年齡”、“電子郵件”列。如果您想按年齡對它們進行排序,請執行以下操作
var data=... // data from spreadsheet
data.sort((a,b)=>a[1]-b[1]);
實際上,sort 需要在確定誰應該排在前面時返回 true 或 false,但透過減去兩個數字,如果得到零或負數,則將其視為 false,而正數將被視為 true。
如果您想按年齡和姓名(按字母順序)排序,您可以這樣做
var data=... // data from spreadsheet
data.sort((a,b)=>(a[1]>b[1])&&(a[0] < b[0]))