整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登錄頁面</title>
/*總體的樣式*/
<style>
/*盒子樣式*/
#box{
width: 350px; //寬
height: 450px; //高
border: 1px solid black; //邊框
border-radius: 10px; //邊框弧度
font-family: 黑體; //字體
letter-spacing:8px; //段間距
word-spacing: 10px; //字間距
line-height: 40px; //行高
font-size: 18px; //字大小
padding: 20px; //內邊框
}
/*給'注冊'賦予樣式*/
.register{
width:280px ; //寬
height: 50px; //高
background-color: skyblue; //背景顏色
border-radius: 10px; //邊框弧度
}
/*將所有邊框都改變*/
*{
border-radius: 5px; 邊框弧度
}
/*使用class選擇器，賦予number寬高和邊框*/
.number{
width: 185px; //寬
height: 27px; //高
border-width: 1px; //邊框寬度
}
/*id選擇器*/
#two{
width: 55px; //寬
border-width: 1px; 邊框寬度
}
/*id選擇器*/
#phone{
width: 103px; //寬
}
/*class 選擇器*/
.boxs{
zoom: 75%; //清除浮動
color: darkgray; //顏色
}
/*class選擇器*/
.box_a{
width: 50px; //寬
height: 50px; //高
background-image: url("../image/04.jpg "); //背景圖片
background-repeat: no-repeat; // 是否平鋪
background-size: 50px 25px; //背景尺寸
position: relative; //定位 相對定位
left: 310px; //定位后左移
bottom: 32px; //定位后下移
}
</style>
</head>
<body>
<div id="box">
<h1>請注冊</h1>
<p style="color: darkgray">已有帳號?<a href="https://im.qq.com/index">登錄</a></p>
<form action="" method="post">
<label for="name">用戶名</label>
<input type="text" placeholder="請輸入用戶名" id="name" class="number"> <br>
<label for="phone">手機號</label>
<select name="" id="two" class="number">
<optgroup>
<option style="" class="">+86</option>
</optgroup>
</select>
<input type="text" placeholder="請輸入手機號" id="phone" class="number"> <br>
<label for="mima">密?碼</label>
<input type="password" placeholder="請輸入密碼" id="mima" class="number"> <br>
<label for="mima">驗證碼</label>
<input type="password" placeholder="請輸入驗證碼" id="is" class="number">
<div class="box_a"></div>
<div class="boxs">
<input type="radio" id="" class="accept">閱讀并接受協議<br>
</div>
<input type="submit" value="注冊" class="register" >
</form>
</div>
</body>
</html>
在這里插入圖片描述家好，很高興又見面了，我是姜茶的編程筆記，我們一起學習前端相關領域技術，共同進步，也歡迎大家關注、點贊、收藏、轉發，您的支持是我不斷創作的動力
在 JavaScript 中，Array.prototype.shift 方法用于移除數組中的第一個元素，并返回該元素。為了更好地理解這個方法的內部機制，我們將從零開始實現一個自定義的 shift 方法，并逐步解析其實現步驟。
shift 方法會移除數組中的第一個元素，并返回該元素。以下是我們自定義實現的 shift 方法的代碼：
Array.prototype.myShift = function() {
// 檢查數組是否為 null 或 undefined
if (this == null) {
throw new TypeError('Array.prototype.myShift called on null or undefined');
}
const O = Object(this);
const len = O.length >>> 0;
// 如果數組為空，返回 undefined
if (len === 0) {
O.length = 0;
return undefined;
}
// 保存第一個元素
const firstElement = O[0];
// 將數組元素左移
for (let k = 1; k < len; k++) {
O[k - 1] = O[k];
}
// 刪除數組最后一個元素
delete O[len - 1];
O.length = len - 1;
// 返回第一個元素
return firstElement;
};
1. 檢查數組是否為 null 或 undefined
確保 this 不為空：
if (this == null) {
throw new TypeError('Array.prototype.myShift called on null or undefined');
}
2. 將 this 轉換為對象，并獲取數組長度
將 this 轉換為對象并獲取數組長度：
const O = Object(this);
const len = O.length >>> 0;
3. 處理空數組的情況
如果數組為空，返回 undefined 并將數組長度設為 0：
if (len === 0) {
O.length = 0;
return undefined;
}
4. 保存第一個元素
將第一個元素保存到 firstElement 變量中：
const firstElement = O[0];
5. 將數組元素左移
使用 for 循環將數組元素左移：
for (let k = 1; k < len; k++) {
O[k - 1] = O[k];
}
6. 刪除數組最后一個元素
刪除數組的最后一個元素并更新數組長度：
delete O[len - 1];
O.length = len - 1;
7. 返回第一個元素
返回保存的第一個元素：
return firstElement;
你可以使用 shift 方法輕松地移除數組中的第一個對象。例如，移除數組中的第一個對象元素：
const objects = [{ id: 1 }, { id: 2 }, { id: 3 }];
const firstObject = objects.myShift();
console.log(firstObject); // 輸出 { id: 1 }
console.log(objects); // 輸出 [{ id: 2 }, { id: 3 }]
通過這種方式，我們可以移除數組中的第一個對象元素，簡化對象處理過程。
通過實現自定義的 shift 方法，我們深入理解了 JavaScript 中數組的操作方式。相信你也可以更好地掌握 shift 方法的內部機制，并提升你的 JavaScript 編程技巧。如果你有任何問題或建議，歡迎在評論區留言交流！祝你編程愉快！
試左移是什么
簡單說，左移軟件測試就是將開發周期看作從左到右的一條直線。在舊模式中，測試僅在這條直線的最右邊發揮作用。認識到這一瓶頸，我們現在希望將測試的開始位置盡量左移。左移是在軟件交付過程中盡早發現和防止缺陷的一種實踐方法，目的是盡量在軟件開發生命周期中盡早將測試任務左移，以提高產品質量。左移測試意味著在軟件開發過程的早期階段進行測試。
測試左移理論上的優點：
測試左移理論上的缺點：
開發以為：
* 測試左移完全是工作的轉移，變成了純是開發做測試
測試以為：
* 測試左移，工作全是開發的，但是出問題測試也都要擔責
當我們討論這個痛點之前，我們一定繞不過去的一個問題就是：開發測試比 ，目前的測試左移是我們主動選擇的結果還是被動選擇的結果
結論：以目前云音樂的開發測試比，我們很難完全支持所有業務，此處涉及組織敏感數據，細節不在此處展開
局部的測試左移：
理想的測試左移：
事前
事中
事后
通過事前、事中、事后的方式，顯著的提升確定性、提高質量，同時也能減少測試左移，研發的體感，避免工作量的轉移
測試左移一定需要具有強大的自動化用例，通過穩定、準確、覆蓋率高的自動化測試用例提高整體線下質量。這里涉及到服務端測試用例與客戶端測試用例，目前根據業界自動化成熟度在服務端自動化要求會更加高，需要涉及絕大部分場景，客戶端這塊主要用于穩定性自動化與核心用例回歸兜底
目前從行業內技術發展看，服務端的自動化技術已經較成熟，不管是接口測試還是引流自動化，服務端自動化具有幾個優點
首先是服務端測試用例的提升，平臺這塊主要希望服用gotest接口測試平臺，核心2個關鍵次：穩定、覆蓋率高
最終期望 3分：服務端線下接口覆蓋率達到95%，CI用例通過率95%；代碼覆蓋率：50% 5分：服務端線下接口覆蓋率達到99%，CI用例通過率99%；代碼覆蓋率：60%；
服務端自動化長遠方案：加強引流平臺的建設，通過線上流量錄制回放，并做好線上流量的用例、場景管理，進一步減少自動化用例成本
目前從行業內技術發展看，客戶端的自動化技術相對還需要突破，行業內經常聽說某團隊維護幾萬的服務端自動化腳本，但是很少聽說某團隊維護超過1000以上的客戶端腳本，客戶端自動化具有以下特點：
客戶端中短期方案：
瀑布流場景：
瀑布流場景用戶操作簡單，核心功能主要為上滑與下滑，自動化運行簡單，可以通過UI自動化執行上滑下滑，然后通過截圖，圖像對比進行校驗，成功率較高，即使是千人千面也可以通過mock規避相關個性化問題，因此后續涉及瀑布流場景建議UI自動化突破
自定義動態生成場景：
自定義動態下發場景，客戶端最終的界面是通過服務端約定協議自動生成的，因此只要和客戶端引擎、協議打通，最終的界面是確定的，UI自動化可以針對協議編寫自動化腳本，穩定性方面可以極大的規避之前UI界面變動導致的成功率較低的問題
客戶端是絕大部分功能上線交付消費者的中心節點，集中做好客戶端的功能保障，在很大程度上能形成中心化的兜底，規避較多的重大問題。因此云音樂主要在測試用例三層兜底、版本流程發布管控上做了較大投入
云音樂客戶端版本版本發布設定三層兜底，首先是P00用例，只出為最核心的關鍵用例集，只要在涉及到發布，包產物有變動，都需要執行一次關鍵核心用例集
然后是P0用例，大概1000條左右，按照正常凍結集成時間，一天內執行完，主要包含日常回歸的主要用例，每個模塊的主流程
最后是P1用例，大概3000條左右，主要包含每個模塊其他額外的分支場景，該用例需要執行3天，且不需要考慮用戶有修改代碼，每次只執行一次
通過三層兜底，我們客戶端實現了核心功能只要改動都做好了回歸，分之場景一定周期也能做到全量回歸，通過分級做到了成本與回歸面的統一
通過版本發布的checklist流程化，保障每次包的發出，不會出現較大的問題，讓每次包產物的變化得到性能、功能、埋點、穩定性等方面的驗證
當前面所有的測試、兜底都完成后，還是會有問題泄漏，因此我們也需要有良好的問題發現能力，避免質量顯著下降
我們希望重點項目上線前默認都是有監控的，帶著監控上線的功能才更加具有確定性
服務端系統需要關注：
前端監控需要關注：
同時發布要分批次，并做好分批次監控觀察
1、重點項目-關聯標記（項目自定義標記，自定義流量標記x-proj-tag）
2、服務端鏈路監控告警區分：大前端請求API透傳標記+網關請求流量打標+腳手架中間件透傳標記+應用日志監控SDK上報流量標記+監控平臺通過流量標記區分監控告警內容
3、客戶端監控告警區分：大前端日志異常和崩潰上報帶上業務自定義標記
監控的效果需要可被觀測，因此分級的重要的報警都會被集中到中心化群里被所有人觀測，提高處理者處理的壓力和動力
以上就是我對測試左移的一些理解，也包含了挺多測試右移的思想。主要適用于風險適中的業務，對涉及資金類、電商核心流程等需要謹慎看待
作者:陽際榮(韓鍔)
來源:微信公眾號:網易云音樂技術團隊
出處:https://mp.weixin.qq.com/s/RApeHXYpmm1nPVLW1Y0ahw
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
