推電動車無線充電技術！高通與 BRUSA 簽商用授權協議

發佈日期: 2020-06-23 作者: admin

美國高通（Qualcomm）與 BRUSA Elektronik AG 宣布，雙方已達成電動車無線充電 (WEVC) 專利授權協議。BRUSA 獲得 Qualcomm HaloTM 專利發明授權後，未來將致力提供插電式混合動力車與電動車用 WEVC 系統的商業化服務，而高通將提供 BRUSA 專利許可授權，使 BRUSA 能為特定車廠開發、製造與供應 WEVC 系統。 BRUSA Elektronik AG 一直以來都是無線充電領域的先驅者，其開發的 ICS 無線充電系統能以安全且高效能的方式傳輸電力至車輛，消除電動車目前對充電線路的依賴。高通無線充電副總裁兼總經理 Steve Pazol 表示，這項授權協議能拓展 Qualcomm Halo 供應商網絡並增加多樣性，為車廠提供另一個先進發明的可靠管道。目前，BRUSA 正與多家國際知名車廠一同開發 WEVC 系統，致力商業化無線充電系統，其中，也包含 Qualcomm HaloTM 方面，以利未來市場能推出具無線充電功能的車款。

本站聲明:網站內容來源於EnergyTrend https://www.energytrend.com.tw/ev/,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※如何讓商品強力曝光呢? 網頁設計公司幫您建置最吸引人的網站，提高曝光率!!

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

※幫你省時又省力,新北清潔一流服務好口碑

※別再煩惱如何寫文案,掌握八大原則!

摩根汽車計畫投資600萬英鎊研發新型電動汽車

發佈日期: 2020-06-18 作者: admin

據英國媒體報導，近日，摩根汽車公司宣佈啟動一項價值600萬英鎊的項目，用於研發新型混合動力汽車及電動汽車，將從2019年開始生產。該項目主要研發混合及電力動力系統。

據悉，英國先進推進動力中心為該項目提供資金，英國德爾塔汽車運動公司和波滕紮科技將提供其他支持。摩根汽車已經成功研發出純電動汽車EV3，將在今年晚些時候投入市場，而先進推進動力中心的資金支持將會幫助摩根研發更多使用其他燃料的車型。

摩根汽車董事總經理史蒂夫˙莫里斯表示，從十年前的LifeCar項目開始，公司就致力於研究發展新的動力推進技術，將在2020年之前研發並生產實現最棒的混合動力及電動傳動系統解決方案。

本站聲明:網站內容來源於EnergyTrend https://www.energytrend.com.tw/ev/,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※為什麼 USB CONNECTOR 是電子產業重要的元件?

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想要讓你的商品成為最夯、最多人討論的話題?網頁設計公司讓你強力曝光

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

※新北清潔公司,居家、辦公、裝潢細清專業服務

2015上半年中國風電、光伏裝機量雙雙大增

發佈日期: 2020-06-18 作者: admin

中國官方統計2015上半年全國裝機量達7.73GW，比去年同期增長113%；風力發電在此時期也增加了9.1GW，也比去年上半年大幅增加50.9%。但是，光伏與風力發電雙雙面臨棄電問題，電網建設需要加緊趕工。

中國預計在2016年下修風力發電電價，使眾多風電企業加緊在2015年安裝風力發電機組；據中國國家能源局統計，2015前半年全國風力發電量比去年前半年成長了27.4%來到97.7TWh。然而，加速安裝的同時也造成棄風率成長了6.7%達到15.2%，其中，東北和西北地區的棄風率增加、河北棄風率下降；一部分原因出於東北地區的風速較高，上半年的總風速利用時間提升到993小時。

而棄風的主要問題也與棄光問題相同，因為風力發電集中地區的電網電纜基礎建設不足以輸出所發電力，且當地用電量也不足以消納。

在併網量方面，2015年上半年新增的風電併網量9.1GW，主要集中在甘肅（1.34GW）、寧夏（1.28GW）、內蒙古（847MW）、雲南（836MW）、山西（786MW）。

本站聲明:網站內容來源於EnergyTrend https://www.energytrend.com.tw/ev/,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※如何讓商品強力曝光呢? 網頁設計公司幫您建置最吸引人的網站，提高曝光率!!

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

※幫你省時又省力,新北清潔一流服務好口碑

※別再煩惱如何寫文案,掌握八大原則!

特斯拉下調2016中國區銷量目標至5000輛

發佈日期: 2020-06-17 作者: admin

近日，特斯拉CEO伊隆•馬斯克（ElonMusk）表示，將下調2016年中國區銷量目標至5000輛。另外，特斯拉正在努力尋找當地的合作夥伴，希望能在今年上半年順利於國內建廠。

據悉，2015年前9個月，特斯拉在中國銷售了3025台電動汽車，離2014年定下的目標1萬輛相差很遠，業績不佳是馬斯克下調了中國銷售目標的主要原因。

資料顯示，香港已成為特斯拉ModelS全球保有密度最高的城市，在2015年全球共計交付的50,580輛ModelS中，有2,221輛是來自香港的訂單，占全球約4.39%。近兩年，香港政府鼓勵市民使用電動汽車，並在香港推行電動汽車首次免登記稅政策，使電動車註冊量增長了270%，而特斯拉ModelS占到全部電動車份額的80%。

相比而言，大陸市場對特斯拉的政策支持力度顯得不足。馬斯克稱，自己的公司希望能在今年上半年順利於國內建廠，並借此減輕進口稅收方面的壓力，以及爭取更多政府為新能源車專供的政策優惠。

本站聲明:網站內容來源於EnergyTrend https://www.energytrend.com.tw/ev/,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※為什麼 USB CONNECTOR 是電子產業重要的元件?

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想要讓你的商品成為最夯、最多人討論的話題?網頁設計公司讓你強力曝光

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

※新北清潔公司,居家、辦公、裝潢細清專業服務

JavaScript入門經典（第7版）讀書筆記

發佈日期: 2020-06-16 作者: admin

斷斷續續看了十來天，終於看完了，還是學到些東西，這本書還是不錯的，各方面都有涉及。

補充了下之前不完善的JS 知識

筆記一般只記必要的東西。‎

1 JavaScript 基礎

1.1 JavaScript 簡介

1.1.1 Web 腳本編程基礎

服務器端和客戶端編程
JavaScript 簡介
JavaScript 起源
瀏覽器的競爭
<script> 標籤
- html5 script 標籤不用指定屬性
DOM 簡介
W3C 和標準兼容
window 和 document 對象
對象表示法
與用戶交互
document.write()
讀取 document 對象的屬性

1.2 創建簡單的腳本

1.2.1 在 Web 頁面里添加 JavaScript

把代碼放在 script 標籤內
通過 src 引用外部 js 文件

1.2.2 編寫 JavaScript 語句

代碼註釋
- 一般文件名後綴 .min.js 是去掉了空白和註釋

1.2.3 變量

1.2.4 操作符

算術操作符
操作符優先級
對字符串使用操作符+

1.2.5 捕獲鼠標事件

onClick 事件處理器
- HTML 里不區分大小寫,所以屬性名 onclick 小寫也可以
onMouseOver 和 onMouseOut 事件處理器
- 使用 this 引用 HTML 元素
```
<img src="1.png" onmouseover="this.src='2.png';">
```

1.3 使用函數

1.3.1 基本語法

1.3.2 調用函數

把 JavaScript 代碼放置到頁面的<head>區域
- 函數放到文檔開頭,確保在調用前已經被定義
- 函數如果多次定義,會使用最後的定義
給函數傳遞參數
多參數
從函數返回值
- 如果沒有 return, 會返回 undefined

匿名函數

function sayHello() {
    alert("hello");
}

var sayHello = function() {
    alert("hello");
}

1.4 函數的更多知識

1.4.1 變量作用域

使用 this 關鍵字
使用 let 和 const
- 塊級作用域 let
用 const 關鍵字聲明變量

1.4.2 箭頭函數

var sayHello = function() { alert("hello"); };

var sayHello = () => alert('hello');

var myFunc = x => alert(x);

myFunc = (x, y) => alert(x + y);

myFunc = (x, y, z) => {
    let area = x*y + 5;
    let boxes = area / z;
    return boxes;
}

1.4.3 設置默認參數

1.5 DOM 對象和內置對象

1.5.1 與用戶交互

alert()
- 術語“模態”的含義
- confirm()
```
var answer = confirm("are you ok?");
```

prompt()

var answer = prompt("what is your full name?");
var answer = prompt("what is your full name?", "cai ji");

1.5.2 根據 id 選擇元素

var myDiv = document.getElementById("div1");

innerHTML 屬性

var myDivContents = document.getElementById("div1").innerHTML;
document.getElementById("div1").innerHTML = "heheda";

1.5.3 訪問瀏覽器歷史記錄

alert(history.length);
history.forward();
history.backward();
history.go(-3);
history.go(2);
history.go("baidu.com");

1.5.4 使用 location 對象

location 的屬性 .href .protocol .host .hostnmae .port .pathname .search .hash

用 location 對象導航
- 兩種導航到新頁面的方式 location.href = “www.baidu.com”; location.replace(“www.baidu.com”); 前者會保留舊頁面在歷史記錄里
刷新頁面
- location.reload(); 避免使用緩存 location.reload(true);
獲取瀏覽器信息: navigator 對象
- navigator 保留瀏覽器本身的數據
- navigator 的屬性 .appName .appCodeName .appVersion .language .cookieEnabled .cpuClass .onLine .platform .plugins.length
- navigator 返回的信息並不準確

1.5.5 日期和時間

創建具有當前日期和時間的 Date 對象

var mydate = new Date();
var year = mydate.getFullYear();
var month = mydate.getMonth();
var date = mydate.getDate();
var day = mydate.getDay();    // 星期
var hours = mydate.getHours();
var minutes = mydate.getMinutes();
var seconds = mydate.getSeconds();

創建具有指定日期和時間的 Date 對象

var d1 = new Date("October 22, 1995 10:57:22");
var d2 = new Date(95, 9, 22);
var d3 = new Date(95, 9, 22, 10, 57, 0);

設置和編輯日期與時間

var mydate = new Date();
document.write(mydate.getDay());
mydate.setDate(15);
document.write(mydate.getDat());
document.write(mydate.toDateString() + mydate.toTimeString());

利用 Math 對象簡化運算
- Math 的一些常見方法 .ceil(n) .floor(n) .max(a, b, c, …) .min(a, b, c, …) .round(n) 四舍五入 .random() 返回一個 0 到 1 的隨機數
取整
獲得最大值和最小值

生成隨機數

function myRand(range) {
    return Math.round(Math.random() * range);
}

数字常數

.E 自然常數,約為 2.718 .LN2 2 的自然對數,約為 0.693 .LN10 10 的自然對數,約為 2.302 .LOG2E 以 2 為底 e 的對數,約為 1.442 .LOG10E 以 10 為底 e 的對數,約為 0.434 .PI 圓周率,約為 3.14159 .SQRT1₂ 2 的平方根的倒數,約為 0.707 .SQRT2 2 的平方根,約為 1.414

關鍵字 with

with (Math) {
    var myRand = random();
    var biggest = max(2, 3, 5);
    var height = round(11.22);
}

2 JavaScript 編程

2.1 数字和字符串

2.1.1 數值

整數
浮點數
十六進制數,二進制數和八進制數

2.1.2 全局方法

toString()

var x = 13;
alert(x.toString());
alert(x.toString(16));
(11).toString();

toFixed()

x.toFixed(0); // "13"
x.toFixed(3); // "13.000"

toExponential()

var num = 666;
num.toExponential(4); // "6.6600e+2"
num.toExponential(6); // "6.660000e+2"

2.1.3 Number 對象

Number.isNaN()
- 當試圖把一些非數值當做數值處理,卻無法得到數值時,返回值就是 NaN
- 示例
```
Number.isNaN(3); //false
Number.isNaN(0 / 0); // true
```
Number.isInteger()
Number.parseFloat() 和 Number.parseInt()
- 解析的字符串首字符如果是一個数字,函數會持續解析到数字結束
```
Number.parseFloat("21.4"); // 21.4
Number.parseInt("12px",10); // 12
```
無窮大
- 表示無窮的關鍵字 Infinity -Infinity
- isFinite() 會把參數轉換為數值,如果結果是 NaN,正無窮大或負無窮大,函數返回 false

2.1.4 Number() 函數

該函數會盡可能返回一個對等的數值,如果失敗,返回 NaN

2.1.5 布爾值

如果布爾值被用作計算,true 為 1, false 為 0
JS 里被當做 false 的值
1. 布爾值 false
2. 未定義 undefined
3. null
4. 0
5. NaN
6. “”

非操作符

2.1.6 null(空) 和 undefined(未定義)

undefined 不是關鍵字,是未定義的全局變量

2.2 操作字符串

2.2.1 字符串

length 屬性
轉義序列
字符串方法
- concat
- indexOf
- lastIndexOf
- repeat var inStr = “a b”; var outStr = inStr.repeat(3)
- replace
- split
- substr string1.substr(4, 11); string1.substr(4);
- toLowerCase
- toUpperCase

2.2.2 模板字符串

var name = "aa";
var course = "bb";
var myString = `hell ${name}, welcome ${course}`;

2.3 數組

2.3.1 數組

JS 的數組能夠存放任何數據類型

創建新數組
- 數組也是一個對象 var myArray = new Array(); var myArray = [];

初始化數組

var myArray = ['111', '22'];
myArray[20] = "333e";
myArray.length

數組的方法
- concat
- join 把數組的全部元素連接在一起形成一個字符串 var longDay = myArray.join(“-”);
- toString 相當於 myArray.join(“,”);
- indexOf 沒有找到返回-1
- lastIndexOf
- slice 可以為負數
- sort 把數組元素按字母順序排列
- splice myArray.splice(2, 1, “heheda”); 指向索引為 2 的元素,刪除 1 個元素,插入一個新元素,返回被刪除的元素

2.3.2 如何遍曆數組

使用 forEach()
- 接受一個函數作為參數,並將函數依次應用與數組中的每個元素
```
var myArray = [1, 2, 3, 4];
function cube(x) {
    console.log(x*x*x);
}
myArray.forEach(cube);
```
- forEach 不返回任何值

使用 map()

和 forEach 的區別在於 map 會返回和最初數組相同大小的新數組

var myArray = [1, 2, 3, 4];
fucntion cube(x) {
    return (x*x*x);
}
var newArray = myArray.map(cube);

使用 for-of 訪問數組

var myArray = [2,3,4,5];
functionn cube(x) {
    console.log(x*x*x);
}
for (var y of myArray) {
    cube(y);
}

2.3.3 三點表示法

組合多個數組
```
var array2 = [1, 2, ...array1, 3];
```

用參數的數組來調用函數

var myArray = [1, 2, 3];
alert(Math.min(...myArray));

收集數據
```
var [a, b, ...c] = [1, 2, 3, 4, 5];
```

2.4 用 JavaScript 處理事件

mousedown 和 mouseup 在 click 前觸發
ctrlKey shiftKey altKey metaKey

2.4.1 事件的類型

一些常見事件
1. 鼠標事件
  - onclick
  - oncontextmenu 鼠標右鍵彈出菜單
  - ondblclick
  - onmousedown
  - onmouseenter 鼠標移動到一個元素上時
  - onmouseleave
  - onmousemove 鼠標在一個元素上移動時
  - onmouseover 鼠標移動到一個元素或其子元素時
2. 鍵盤事件
  - onkeydown 按下按鍵
  - onkeypress 按下並放開按鍵
  - onkeyup 釋放按鍵
3. DOM 對象事件
  - onerror 加載一個外部文件出現錯誤時
  - onload
  - onresize
  - onscroll 滾動了元素的滾動條
4. 表單事件
  - onblur 元素失去焦點時
  - onchange
  - onfocus
  - onreset 重置表單
  - onselect
  - onsubmit

2.4.2 事件處理器

內聯事件處理器

<a href="http://www.baidu.com" onclick="alert('hello')">baidu</a>

作為 DOM 對象的屬性的事件處理器

// <a href="xxx" id="a1">aa</a>
var myLink = document.getElementById('a1');
myLink.onclick = function() {
    alert("hello");
}

使用 addEventListener()

var myLink = document.getElementById('a1');
function sayHello() {
    alert("hello");
}
myLink.addEventListener('click', sayHello);
myLink.removeEventListener('click', sayHello);

添加多個監聽器
- 使用 addEventListener 可以對一個事件添加多個函數

2.4.3 event 對象

myInputField = document.getElementById('a');
function myFunction(e) {
    var kc = e.keyCode;
    if (kc == 27) {
        alert("xx");
    }
}
myInputField.addEventListener('keydown', myFunction);

event 對象會自動傳遞給事件處理器
e.keyCode 表示按下了哪個鍵,27 表示 Escape

阻止默認行為

var myLink = document.getElementById('a');
function refuseAccess(e) {
    alert("wrong");
    e.preventDefault();
}
myLink.addEventListener('click', refuseAccess);

事件冒泡和捕獲
- 嵌套元素時,各層元素都有事件監聽器時,執行順序為冒泡
- addEventListener 的第三個參數默認為 false,對於嵌套元素,從內向外執行,像冒泡一樣.

關閉冒泡和捕獲

function myFunction(e) {
    var kc = e.keyCode;
    e.stopPropagation();
    if (kc == 27) {
        alert("1");
    }
}

2.5 程序控制

2.5.1 條件語句

和 C 差不多

if() 語句
比較操作符
- = 值和類型都相等
測試相等性
if 進階
測試多個條件
switch 語句
邏輯操作符

2.5.2 循環和控制結構

while
do…while
for
用 break 跳出循環

用 for…in 在對象集里循環

var days = [1, 2, 3, 4];
for (i in days) {
    alert(i);
}

2.5.3 設置和使用定時器

這兩個方法都是 window 對象的方法

setTimeout()

function hide(elementId) {
    document.getElementById(elementId).style.display='none';
}
window.onload = function() {
    setTimtout("hide('id1')", 3000);
}
var timer1 = setTimeout("hide('id1')", 3000);
clearTimeout(timer1);

setInterval()

var timer1 = setInterval("updateClock()", 1000);
clearInterval(timer1);

3 理解 JavaScript 對象

3.1 面向對象編程

3.1.1 什麼是面向對象編程

3.1.2 創建對象

創建直接實例

myNewObject = new Object();
myNewObject.showInfo = myFunc;
myNewObject.info = 'this is a info';

使用關鍵字 this
- this 在 HTML 內聯 JS 里指此 HTML 元素,也可指向它所屬的對象

匿名函數

myNewObject.showInfo = function() {
    alert(this.info);
}

使用構造函數

如果要創建一個類的多個實例,可以創建構造函數

function Car(Color, Year, Make, Miles) {
    this.color = Color;
    this.year = Year;
    this.make = Make;
    this.odometerReading = Miles;
    this.setOdometer = function(newMiles) {
        this.odometerReading = newMiles;
    }
}
var car1 = new Car("blue", "1998", "Ford", 77777);

3.1.3 用 prototype 擴展和繼承對象

擴展對象

function Person(personName) {
    this.name = personName;
    this.info = 'a';
    this.showInfo = function() {
        alert(this.info);
    }
}
var person1 = new Person('adam');
var person2 = new Person('hehe');
Person.prototype.sayHello = function() {
    alert(this.name + 'say hello');
}

繼承對象

function Pet() {
    this.animal = "";
}
function Dog() {
    this.breed = "";
}
Dog.prototype = new Pet();

3.1.4 封裝

function a(b, c, d) {
    function kk(m, n) {
        return m + n;
    }
}

3.2 對象進階

3.2.1 類

新引入的 class 關鍵字和 constructor

function Pet() {
    this.animal = "";
    this.setAnimal = function(newAnimal) {
        this.animal = newAnimal;
    }
}

class Pet {
    constructor(animal) {
        this.animal = animal;
    }
    setAnimal(newAnimal) {
        this.animal = newAnimal;
    }
}

使用 getter 和 setter

下劃線前綴防止被重複調用

class Pet {
    constructor(animal, name) {
        this.animal = animal;
        this.name = name;
    }
    get name() {
        return this._name;
    }
    set name(n) {
        n = n.charAt(0).toUpperCase() + n.slice(1).toLowerCase();
        this._name = n;
    }
}

Symbol
- 創建的 Symbol 一定是唯一的傳的參數只是說明
```
var myname = Symbol('nickname');
myCat[myname] = 'heheda';
```

3.2.2 對象繼承

使用 extends 和 super

class Dog extends Pet {
    constructor(name, breed) {
        super(name);
        this.breed = breed;
    }
}

3.2.3 使用功能檢測

if (document.getElementById) {
    // do something
} else {
    // other
}

typeof

if (typeof document.getElementById == 'function') {
    // do something
} else {
    // other
}

typeof 的返回值 “number” “string” “boolean” “object” null undefined

3.3 DOM 腳本編程

3.3.1 DOM 節點

節點類型
- nodeType 每種節點類型都有一個關聯的數值,保存在屬性 nodeType
  1. 元素
  2. 屬性
  3. 文本
  4. CDATA 區域
  5. 實體引用
  6. 實體
  7. 執行指令
  8. HTML 註釋
  9. 文檔
  10. 文檔類型(DTD)
  11. 文檔片段
  12. 標籤
- childNodes 屬性
```
function countListItems() {
    var olElement = document.getElementById("toDoList");
    var count = 0;
    for (var i = 0; i < olElement.childNodes.length; i++) {
        if (olElement.chiodNodes[i].nodeType == 1)
            count++;
    }
}
window.onload = countListItems;
```
- firstChild lastChild myElement.childNodes[0] myElement.childNodes[myElement.childNodes.length – 1];
- parentNode 屬性
- nextSibling previousSibling
使用 nodeValue
使用 nodeName

3.3.2 用 getElementsByTagName() 選擇元素

基本用法 var myDics = document.getElementsByTagName(“div”);
document.getElementsByClassName()

3.3.3 讀取元素的屬性

var myNode = document.getElementById("id1");
alert(myode.getAttribute("title"));

3.3.4 Mozilla 的 DOM 查看器

創建新節點
- 創建步驟
  1. 創建新節點
    - createElement() var newDiv = document.createElement(“div”);
    - createTextNode() var newTextNode = document.createTextNode(“heheda”);
    - cloneNode() var myDiv = document.getElementById(“id1”); var newDiv = myDiv.cloneNode(true) true 代表會複製子節點一般需要修改 id 值
  2. 添加到 DOM 樹
操作子節點
- appendChild() var newText = document.createTextNode(“heheda”); var myDiv = document.getElementById(“id1”); myDiv.appendChild(newText);
- insertBefore() var newPara = document.createElement(“p”); var myDiv = document.getElementById(“id1”); var para2 = document.getElementById(“para2”); myDiv.insertBefore(newPara, para2);
- para.replaceChild(new, old)
- removeChild()
```
var myDiv = document.getElementById("id1");
var myPara = document.getElementById("para2");
var removedItem = myDiv.removeChild(myPara);
alert(removedItem.getAttribute("id"));
```

編輯元素屬性

var myPara = document.getElementById("para1");
myPara.setAttribute("title", "opening paragraph");

動態加載 JavaScript 文件

var scr = document.createElement("script");
scr.setAttribute("src", "newScript.js");
document.head.appendChild(scr);

3.4 JSON 簡介

3.4.1 JSON 是什麼

使用 JSON 表示法時,對象可以方便的轉換為字符串來進行存儲和轉換
JSON 的真正優雅之處在於對象在 JSON 里以普通 JS 代碼錶示,因此可以利用 JS “自動” 解析功能

JSON 語法

var jsonObject = {
    "param1": "value1",
    "param2": "value2"
}

3.4.2 訪問 JSON 數據

eval 函數參數:
1. 表達式
2. 表達式字符串
3. 字符串,其中是括號包含的 json

var x = eval(1*2);
eval("a=1;b=2;document.write(a+b);");
var user = '{"user":"admin", "location": "spain"}';
var myObject = eval('(' + user + ')');

使用直接瀏覽器 JSON 支持
- 最新瀏覽器都對 JSON 提供直接支持,所以可以不用 eval 函數
- 瀏覽器會創建一個名為 JSON 的 JS 對象來管理 JSON 的編碼和解碼,這個對象有兩個方法,stringify() 和 parse()

使用 JSON.parse()

var Mary = '{"h": 1.9, "age": 12}';
var myObject = JSON.parse(Mary);
var out = "";
for (i in myObject) {
    out += i + " = " + myObject[i] + "\n";
}
alert(out);

3.4.3 JSON 的數據序列化

使用 JSON.stringify()

var Dan = new Object();
Dan.height = 1.85;
Dan.age = 41;
Dan.eyeColor = "blue";
alert(JSON.stringify(Dan));

3.4.4 JSON 數據類型

參數部分的規則
1. 不能是 JS 保留的關鍵字
2. 不能数字開頭
3. 特殊字符只能有下劃線和美元符號
值可以是以下數據類型
1. 數值
2. 字符串
3. 布爾值
4. 數組
5. 對象
6. null

3.4.5 模擬關聯數組

在 JS 中,object[“property”] 和 object.property 是對等的

var conference = {"a": "1", "b": "2"};
alert(conference["a"]);
alert(conference.a);

3.4.6 使用 JSON 創建對象

用方括號表示數組 var categories = [“news”, “sports”];

屬性

var user = {“a”: 1, “b”: 2}; var name = user.a;

方法

var user = {
    "a": 1,
    "setName": function(newName) {
        this.username = newName;
    }
}
user.setName("heheda");

當 JSON 作為通用數據交換格式時,值不能放函數

數組

var bookListObject = {
    "a": [1, 2, 3]
}
var book = bookListObject.a[1];

對象

3.4.7 JSON 安全性

eval() 能執行任何 JS 命令,對於來源不明的 JSON 數據可能存在安全問題,安全的辦法是使用內置 JSON 解析器,它只識別 JSON 文本而不會執行腳本命令

4 用 JavaScript 操作 Web 界面

4.1 HTML 與 JavaScript 編程

4.1.1 HTML5 的新標籤

section
header
footer
nav
article
aside
figure
figcaption
summary

4.1.2 一些重要的新元素

用<video> 回放視頻
用 canPlayType() 測試可用的格式
- media.canPlayType(“video/webm”);

控制回放

var myVideo = document.getElementById("vid1").play();
var myVideo = document.getElementById("vid1").pause();

用<audio> 標籤播放聲音

var soundElement = document.createElement('audio');
soundElement.setAttibute('src', 'sound.ogg');
soundElement.play();
soundElement.currentTime = 12;

用<canvas> 在頁面上繪圖

4.1.3 拖放

4.1.4 本地存儲

兩個對象 localStorage sessionStorage

if (typeof(Storage) != "undefined") {
    localStorage.setItem("key", "value");
    localStorage["key"] = "value";
    alert(localStorage.getItem("key"));
    alert(localStorage["key"]);
}

4.1.5 操作本地文件

查看瀏覽器的支持情況
- if (window.File && window.FileReader && window.FileList)

4.2 JavaScript 和 CSS

4.2.1 CSS 簡介

從內容分離樣式
CSS 樣式聲明
在哪裡保存樣式聲明

4.2.2 DOM 的 style 屬性

4.2.3 用 className 訪問類

4.2.4 DOM 的 styleSheets 對象

啟用,禁用和切換樣式表

4.3 CSS3 簡介

5 與 JavaScript 工具相關的高級技術

5.1 讀取和寫入 cookie

5.1.1 什麼是 cookie

cookie 的局限性

5.1.2 使用 document.cookie 屬性

數據的編碼和解碼

var str = 'hehe (aa) .';
document.write(str + '<br />' + escape(str));

5.1.3 cookie 組成

cookieName 和 cookieValue
domain 用於指明 cookie 屬於哪個域,如果為 a.com ,則 b.a.com 可以訪問這個 cookie
path 指定可以使用 cookie 的路徑
secure 表明瀏覽器把 cookie 發給服務器時,是否要使用 SSL 標準
expires 以 UTC 標準的過期時間

5.1.4 編寫 cookie

var cookieDate = new Date ( 2018, 05, 15 );
var user = "heheda";
document.cookie = "username=" + escape(user)  + ";expires=" + cookieDate.toUTCString();

5.1.5 編寫一個函數來寫 cookie

5.1.6 讀取 cookie

5.1.7 刪除 cookie

把一個 cookie 的失效日期設置為今天之前即可

5.1.8 在一個 cookie 里設置多個值

5.2 用正則表達式匹配模式

5.2.1 創建正則表達式

JS 里兩種生成正則表達式的方法

使用正則表達式字符串字面量
- var myRegExp = FooBar;
```
var myRepExp = /FooBar/;
if (document.getElementById("txt").value.search(myRegExp) == -1) {
    alert("not found");
} else {
    alert("The string occurs");
}
```
- 正則表達式修飾符
i 不區分大小寫 g 全局匹配,而不是找到第一個匹配就停止 m 多行匹配 var aa = /stupid/gi;
- 方括號[]指定範圍
- 處理特殊字符的快捷方式,元字符 \w 等
- 正則表達式限定符 + 重複次數等

使用 JS 的 RegExp 對象

var myPattern = new RegExp("Foobar");
var result = /boy/.exec("heheda");
console.log(result[0]);
myPattern.test("this is a test");
var result = myPattern.exec(myString);

對正則表達式使用字符串方法

match search replace split

var myString = "heheda dada";
var outString = myString.match(/\d+/g);

var myString = "1 ;2 3;4 5";
var outString = myString.split(/\s*;\s*/);

myString.replace(/stupid/ig, "cupid");

用一個函數作為 replace() 的參數

function CtoF(match) {
    return ((match * 9) / 5) + 32;
}
var myString = "for 1 and 5";
myString = myString.replace(/\d+/g, CtoF);

5.3 理解並使用閉包

5.3.1 回顧作用域的相關知識

5.3.2 從一個函數返回另一個函數

5.3.3 實現閉包

閉包是訪問父作用域的一個函數,即便是在該作用域已經結束之後.

傳遞參數

function sayHi(visitor) {
    let msg = visitor + ' says: hello world!';
    return function logMessage() {
        console.log(msg);
    }
}

編輯一個閉包變量

function sayHi(visitor) {
    let msg = visitor + ' says: ';
    return function logMessage(extra) {
        msg = msg + extra;
        console.log(msg);
    }
}
var helloPhil = sayHi("Phil");
var helloSue = sayHi("Sue");

閉包和變量

閉包也允許將一些數據和操作這些數據的函數關聯起來

function sayHi(visitor) {
    let msg = visitor + ' says: hello world';
    return function logMessage() {
        console.log(msg);
    }
}
var helloPhil = sayHi("Phil");
helloPhil()

對象提供了靈活性,但是到處都可以修改,容易出現錯誤.

5.4 用模塊組織代碼

5.4.1 為何使用模塊

模塊使得代碼更容易維護
模塊幫助復用代碼
模塊有助於整齊的全局作用域

5.4.2 模塊基礎知識

一個文件一個模塊,模塊中的內容對外部不可見.
模塊是通過 CORS 跨源資源共享來獲取的

如何包含一個 JS 模塊

JS 要求對模塊使用相對路徑

<head>
  <script type="module" src="./myModule.js"></script>
</head>

nomodule 關鍵字

<script nomodule src=“fallback-option.js”></script>

5.4.3 導出

function fun1(x) {
    alert(x);
}
export func1;

一個簡單的示例模塊

function convertCtoF(c) {
    return (c*1.8) + 32;
}
function convertFtoC(c) {
    return (f-32) / 1.8;
}
export {convertCtoF, convertFtoC}

export var a = "something";
export function func1() {console.log("hello");};

如何在導出時重命名

export var distance = arr[1];
export {arr as routeProperties };

具名的和默認的導出

function mmToInches(d) {
    return d/25.4;
}
export default mmToInches;

5.4.4 導入

import {convertCtoF, convertFtoC} from './tempConvert.js';

默認導入

function mmToInches(d) {
    return d/25.4;
}
export default mmToInches;

import toInches from './convert.js';
console.log(toInches(100));

如何在導入的過程中重命名

import {convertCtoF as cF } from ’./tempConvert.js’;
如何把一個模塊導入為一個對象

import * as temps from ’./tempConvert.js’;

6 專業技能

6.1 良好的編程習慣

6.1.1 避免過度使用 JS

6.1.2 編寫易讀和易維護的代碼

明智地使用註釋
- 代碼較長地函數或對象地簡要說明
- 對易混淆或易誤解代碼地註釋
- 原作者自己地技巧或經驗
- 關於代碼修改地註釋
使用適當地文件名稱,屬性名稱和方法名稱
盡量復用代碼
不要假設

6.1.3 平穩退化

6.1.4 漸進增強

分離樣式,內容和代碼

6.1.5 代碼分離的 JS

脫離 HTML
僅把 JS 作為性能增強手段

6.1.6 功能檢測

6.1.7 妥善處理錯誤

使用 try 和 catch

6.2 調試代碼

6.2.1 調試簡介

錯誤類型
- 語法錯誤
- 運行時錯誤
- 邏輯錯誤
選擇程序員地編輯器
用 alert() 進行簡單調試

6.2.2 更高級地調試

控制台
- console console.log() console.warn() console.info() console.error()
分組消息
- console.group() console.groupEnd() 之間的 log 信息會分組显示
用斷點停止代碼執行
條件性斷點
從代碼中啟動調試器
- debugger;
驗證 JS

6.3 繼續深入學習

6.3.1 為什麼要使用庫

6.3.2 庫能做什麼

一般庫的功能
1. 封裝 DOM 方法
2. 動畫
3. 拖放
4. Ajax

6.3.3 一些常見的庫和框架

Prototype 框架
- 優勢在於 DOM 擴展和 Ajax 處理
Dojo
- 能夠簡化創建程序和用戶界面的工作
React
- 主要用於構建用戶界面
Node.js
- 允許在服務器上編寫和執行 JS
jQuery
- 簡化了 HTML 文檔轉換,事件處理,動畫等多種工作

6.3.4 jQuery 入門

在頁面里引用 jQuery
- 本地下載 <script src=“jquery-3.3.1.js”></script>
- 遠程 <script src=“”></script>
jQuery 的$(document).ready 處理器
- 類似於 window.onload
```
$(document).ready(function() {
    // code
});
```
選擇頁面元素
- $(“”) 即可選擇 HTML 元素 $(“span”) $(“#elem”) //id $(“.classname”) $(“div#elem”) $(“ul li a.menu”) / 類為 menu,且嵌套在列表項里的錨點 $(“p > span”) / p 的直接子元素 span $(“input[type=password]”) $(“p:first”) $(“p:even”) // 全部偶數段落 $(“:header”) //標題元素 $(“:button”) $(“:radio”) $(“:checkbox”) $(“:checked”)

操作 HTML 內容

html() 類似於 innerHTML

var htmlContent = $("#elem").html();
$("#elem").html("<p>here </p>");

text() 只是獲取文本內容

  var textContent = $("#elem").text()
  $("#elem").append("<p>hehe </p>");

attr()

var title = $("#elem").attr("title");
$("elem").attr("title", "new title");

显示和隱藏元素

JS 中 document.getElementById(“elem”).style.visibility = “visible”;

show()

$("div").show();
$("#elem").show("fast", function() {
    // 操作
});

hide()

$("#elem").hide("slow", function() {
    // 隱藏之後的操作
});

toggle()

$("#elem").toggle(1000, function() {
    // xx
});

命令鏈

jQuery 大多數方法都返回一個 jQuery 對象

$("#elem").fadeOut().fadeIn();
$("#elem").text("Hello ").fadeOut().fadeIn();

處理事件

常用方法

$("a").click(function() {
    //
});
function hello() {
    alert("hello");
}
$("a").click(hello);
$("a").on("click", hello);

常見事件 blur focus hover keypress change mousemove resize scroll submit select

6.3.5 The jQuery UI

jQuery UI 提供了高級的效果和可以主題化的掛件

jQuery UI 是什麼
```
$("#datepicker").datepicker();
```

6.3.6 Ajax 簡介

Ajax 入門
XMLHttpRequest 對象
- XMLHttpRequest 能夠建立與服務器的連接,發送 http 請求而不需要加載相應的頁面
- 默認 xhr 只能對同域發起請求,除非服務端做了設置
創建 request 對象
- var request = new XMLHttpRequest();
方法和屬性
- 屬性 onreadystatechage readyState responseText responseXML status statusText
- 方法 abort() getAllResponseHeaders() getResponseHeader(x) open(’method’,’URL’,’a’) // a 默認為 true,表示異步 send(content) setRequestHeader(’x’,’y’)
與服務器通信
在服務器端發生了什麼
處理服務器響應
還有更容易的方法,不是嗎?

6.3.7 用 jQuery 實現 Ajax

load()

$(function() {
    $("#elem").load("newContent.html");
});

$(function() {
    $("#elem").load("newContent.html #info");
});

get() post()

$.get("serverScript.php",
      {param1: "value1", param2: "value2"},
      function(data) {
          alert("server response: " + data);
      });

ajax()
對錶單數據進行序列化 var formdata = $(’#form1’).serialize();

6.3.8 Node.js 簡介

Node.js 使用 V8 JavaScript 引擎

使用一種非阻塞的代碼模式

Author: cat

Created: 2019-11-13 Wed 22:40

本站聲明:網站內容來源於博客園,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※為什麼 USB CONNECTOR 是電子產業重要的元件?

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想要讓你的商品成為最夯、最多人討論的話題?網頁設計公司讓你強力曝光

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

※新北清潔公司,居家、辦公、裝潢細清專業服務

salesforce lightning零基礎學習(十四) Toast 淺入淺出

發佈日期: 2020-06-16 作者: admin

本篇參考：

Toast在項目中是基本不可能用不到的組件，用於在頁面頭部展示一條消息。之前也經常的用，但是沒有深入的研究過，最近正好開始做lightning項目，便深入研究了一下，發現比以前了解的稍微多點，特此總結，便於以後的查看以及給沒有接觸過的小夥伴掃個盲。

一. Toast

Toast 用於在頁面的頭部展示一條消息，比如我們在更新數據完成後會提示修改成功，出現異常會提示更新失敗等。Lightning將Toast封裝成了事件，我們只需要根據指定的步驟獲取Toast事件並且進行fire觸發即可。下方的demo中展示了toast的使用，使用 $A.get(“e.force:showToast”)便可以獲取事件，添加相關的屬性觸發即可實現Toast功能。

showToast : function(component, event, helper) {
    var toastEvent = $A.get("e.force:showToast");
    toastEvent.setParams({
        "title": "Success!",
        "message": "The record has been updated successfully."
    });
    toastEvent.fire();
}

那麼 Toast 有哪些參數呢？

title：此參數用於展示message的標題區域，通常標題會以稍微大的字體展示在上方；
duration：此參數用於設置當前的Toast展示多久后自動消失，單位為毫秒，此屬性可以不填寫，默認為5秒中，如果設置的時間不足5秒也會按照5秒處理；
message：此參數用於展示显示Toast的內容；
mode：Toast展示的模式，Toast支持三種模式：dismissible(展示的消息包含一個關閉按鈕，如果點擊按鈕則可以馬上Toast消失，如果不點擊則默認過5秒消失，這個是默認選項) / pester（不展示關閉按鈕，過幾秒以後自動消失） / sticky（只展示關閉按鈕，不點擊關閉按鈕則永遠不消失）
type：Toast的類型，不同的類型會展示不同的圖標以及不同的顏色樣式。可選擇的值有： error / warning / success / info / other。前四個我們可能經常用，最後一個不經常用，其實other是此屬性的默認值，展示的顏色樣式和info相同，區別是此種不展示圖標。當然不展示圖標不是絕對的，如果搭配了key屬性可以展示其他的圖標，所以如果我們想要展示info的樣式但是不想使用info的圖標，我們可以考慮使用other然後設置key即可。
key：當我們的type選擇了other的情況下，此處可以指定toast裏面展示的other圖標，名字可以在lightning design system的icon中選擇。
messageTemplate：上面的message用於Toast的消息展示，但是只能展示String字符串的信息，如果我們需要其他增強的功能展示（比如想要在toast的message中展示一個可以點擊的URL），我們需要使用messageTemplate通過placeholder放入形參，使用messageTemplateData進行填充。 messageTemplate的placeholder很像我們在custom label中聲明，也是從0開始，使用{}.比如Record {0} created! See it {1}這裏就設置了兩個placeholder，messageTemplateData需要傳兩個參數進來。
messageTemplateData：當時用了messageTemplate以後，需要使用此屬性去將placeholder的值進行替換，裏面封裝的是一組text文本以及其對應的action。

除了Toast以外，小夥伴們可以自行查看： lightning:overlayLibrary（通過Modal 以及 popover展示消息） / lightning:notificationsLibrary（通過notice和toast方式展示消息）

上面既然已經描述完Toast的所有屬性以及Toast所能實現的功能，那麼我們接下來對常用的展示可以進行一些簡單的優化和處理。

場景一. 內容多行展示

Toast默認只能展示單行的內容，我們做了一個demo，將toast設置了sticky，這樣我們可以查看到Toast的html的解析的實現，實現如下圖所示。通過圖片中的css內容我們可以看到toast的內容使用toastMessage forceActionsText兩個進行渲染，因為css渲染也有前後順序，我們只需要對這兩個css樣式進行重寫，設置white-space: pre-line !important; 即可，意為如果有空格情況下，合併所有空行並且保留換行，然後message中對需要換行的地方使用\n進行字符串分隔即可從而實現換行的。

我們嘗試的在當前的component bundle的css重新渲染此樣式發現不可用，所以只能引入外部的static resource覆蓋此樣式。

.toastMessage.forceActionsText{
    white-space : pre-line !important;
}

方式為創建css,內容為上面描述的內容，然後命名上傳到 static resource，代碼引入即可。demo中我們命名的static resource名稱為multipleLineToastCss。

代碼中我們只需要<ltng:require styles=”{!$Resource.multipleLineToastCss}”/>即可。

我們做了簡單的demo去驗證：

<aura:component implements="flexipage:availableForAllPageTypes">
    <ltng:require styles="{!$Resource.multipleLineToastCss}"/>
    <lightning:button variant="brand" label="show toast" onclick="{!c.showToast}"/>
</aura:component>

對應的controller.js

showToast : function(component, event, helper) {
   var toastEvent = $A.get("e.force:showToast");
   toastEvent.setParams({
        mode: 'sticky',
        title: 'Info',
        type: 'info',
        message: 'test message\ntest multiple lines'
    });
    toastEvent.fire();
}

場景二. Toast展示可點擊的URL

某些場景下，我們需要展示Toast的時候搭配URL，用戶點擊URL后跳轉到某個頁面。此種情況下我們只需要使用 messageTemplate 以及 messageTemplateData進行搭配即可實現。

showMyToast : function(component, event, helper) {
    var toastEvent = $A.get("e.force:showToast");
    toastEvent.setParams({
        mode: 'sticky',
        message: 'This is a required message',
        messageTemplate: 'Record {0} created! See it {1}!',
        messageTemplateData: ['Salesforce', {
            url: 'http://www.salesforce.com/',
            label: 'here',
            }
        ]
    });
    toastEvent.fire();
}

場景三. 換 Toast的message的圖標

我們知道當toast的type賦值時，針對success/warning/error/info都會有默認的樣式以及圖標，當我們需要展示其他的圖標時，我們只需要設置type為other或者不設置type（默認為other），然後設置key即可。key的話，我們可以找到lightning design system中的icon的名稱賦值即可。

showToast : function(component, event, helper) {
    var toastEvent = $A.get("e.force:showToast");
    toastEvent.setParams({
        mode: 'sticky',
        title: 'Info',
        type: 'other',
        key:'like',
        message: 'test message\ntest multiple lines'
    });
    toastEvent.fire();
}

二. aura:method

很多內容我們可以進行公用的組件化操作，比如針對toast的展示（我們只需要設置方法傳遞參數，調用即可，不需要每個component的controller/helper js方法都重複的聲明Toast的聲明以及觸發），針對picklist值獲取，針對錶字段label的獲取。製作公用組建需要先了解一個aura封裝的組件名稱，aura:method。

我們在前端正常去進行方法調用通常是綁定一個handler或者執行某個事件從而去調用方法，使用aura:method定義一個方法可以作為組件的API的一部分，這樣我們在client-controller部分可以直接調用此方法。使用aura:method可以設置傳入的參數，也可以設置返回的同步或者異步的結果，所以通常我們可以使用aura:method去做共用組建的內容，作為公用組件，使用aura:method去聲明，其他的component只需要引入此公用組件便有權限直接調用aura:method聲明的方法了。

aura:method總共有以下的屬性：

name：用來聲明方法的名稱，後期調用直接使用此方法調用，傳遞相關的參數即可；
action：此方法要去調用的client-controller的方法；
access：public(在相同namespace的component可以調用此方法) / global(在所有的namespace的component可以調用此方法)；
description：方法描述。

除了以上屬性以外，方法還要有參數，使用aura:attribute去聲明方法體里的參數項。aura:method可以實現同步以及異步的返回，感興趣的可以查看細節，下面內容為通過aura:method實現Toast公用組件。

ToastServiceComponent.cmp

<aura:component access="global">
    <ltng:require styles="{!$Resource.multipleLineToastCss}"/>

    <aura:method access="global" name="showToast" action="{!c.showToastAction}">
        <aura:attribute name="message" type="String" description="the body message will show. use \n to break lines" required="true"/>
        <aura:attribute name="displayTitle" type="String" description="the title hearder will show" required="true"/>
        <aura:attribute name="displayType" type="String" description="success/warning/error/info/other"/>
        <aura:attribute name="mode" type="String" description="dismissible/pester/sticky"/>
        <aura:attribute name="key" type="String" description="you can set name from lightning design system icon section"/>
    </aura:method>

</aura:component>

ToastServiceComponentController.js

({
    showToastAction : function(component, event, helper) {
        var params = event.getParam('arguments');
        var toastEvent = $A.get("e.force:showToast");
        var type = params.displayType;
        if(params.key) {
            type = 'other';
        }
        if(!params.mode) {
            params.mode = 'dismissible';
        }
        toastEvent.setParams({
            "title": params.displayTitle,
            "message": params.message,
            "type": type,
            "mode":params.mode,
            "key": params.key
        });

        toastEvent.fire();
    }
})

接下來是調用：

SimpleToastDemo.cmp：需要引入ToastServiceComponent，設置一個local id

<aura:component implements="flexipage:availableForAllPageTypes">
    <c:ToastServiceComponent aura:id="toastService"/>
    <lightning:button variant="brand" label="show toast" onclick="{!c.showToastHandler}"/>
</aura:component>

SimpleToastDemoController.js： find到aura:id，然後調用方法即可。

({
    showToastHandler : function(component, event, helper) {
        var toastService = component.find('toastService');
        toastService.showToast('this is a toast demo\n this can allow multiple lines\nhere we show like icon','simple toast demo','other','dismissible','like')
    }
})

展示如下：

總結：篇中簡單介紹Toast以及aura:method，詳細了解的自行查看文檔，感興趣的最好了解一下 lightning:overlayLibrary以及lightning:notificationsLibrary。篇中有錯誤的地方歡迎指出，有不懂的歡迎留言。

本站聲明:網站內容來源於博客園,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※如何讓商品強力曝光呢? 網頁設計公司幫您建置最吸引人的網站，提高曝光率!!

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

※幫你省時又省力,新北清潔一流服務好口碑

※別再煩惱如何寫文案,掌握八大原則!

豐田「未來」多國上路，台灣氫燃料車未來何在？

發佈日期: 2020-06-11 作者: admin

日本豐田汽車在去年推出FCEV氫燃料電池車「Mirai（未來）」，目前已在日本、德國、比利時、丹麥、美國等多個國家上市。目前台灣因欠缺相關法規與氫能政策，仍無法讓FCEV上路，或讓氫燃料電池技術廣泛使用。

豐田的Mirai是全球首輛FCEV，電力來自氫燃料電池；運轉時只會產生水，沒有任何廢氣與污染物，且「加氫」也只需要3分鐘就能行駛650公里。日本相當重視氫燃料電池技術，致力於打造「氫社會」，目標在2020年時讓FCEV的市佔率達到1%。目前除了豐田之外，本田汽車也將在今年推出另一款FCEV。

總統當選人蔡英文日前試乘Mirai，負責接待的和泰汽車協理黃明顯表示，目前台灣只有汽油車、柴油車與電動車的檢驗標準，FCEV無法可用，因此自然不能上路。若要在台灣引進FCEV，則政府須就汽車法規與氫燃料政策進行探討，才有可能看到台灣FCEV的「未來」。

豐田Mirai的訂價大約是700萬日幣，日本民眾在國內購買時享有補助，僅需約500萬日幣就能購置。加上日本計畫將2020東京奧運的選手村打造純氫氣功能的「氫氣城」，相關規章與建設正如火如荼展開當中。相較之下，台灣尚無適用法規，自然也就還沒有引入氫燃料的機會。

FCEV較有疑慮的問題是加氫站的設置。除了FCEV與加氫站的數量需到達一定規模才能具有較好的經濟效益外，由於氫容易燃燒，因此加氫站以及相關管線、設備都需就安全性進行多考量，並解決周遭居民的疑慮。Mirai 採用高纖維儲存氫氣，若氫氣外洩時將會自動啟動隔離閥，也有快速揮散氫氣的功能，藉此確保Mirai的行車安全。

（圖：Honda於FC EXPO 2016 展出的氫燃料電池車）

本站聲明:網站內容來源於EnergyTrend https://www.energytrend.com.tw/ev/,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※為什麼 USB CONNECTOR 是電子產業重要的元件?

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想要讓你的商品成為最夯、最多人討論的話題?網頁設計公司讓你強力曝光

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

比亞迪 6 月電動車銷量破 5,000 輛奪全球銷售冠軍

發佈日期: 2020-06-11 作者: admin

比亞迪 6 月新能源汽車銷量突破 5,000 輛，更連續第 2 個月超越特斯拉 (Tesla)、日產 (Nissan) 等競爭對手，成為當月全球新能源汽車銷售冠軍。比亞迪汽車於 3 日在其官方微博公布，今年 6 月，比亞迪以 5,037 輛的銷量，力壓特斯拉的 4,994 輛，蟬聯全球新能源汽車單月銷售冠軍。目前，比亞迪全球市佔率為 10%，仍然落後於特斯拉的 11% 及日產的 13%。在上半年總銷量方面，比亞迪以 2.04 萬輛列第 3 位，日產及特斯拉分別以 2.71 萬及 2.16 萬輛，排首兩位。比亞迪新能源汽車銷量今年以來增長迅速，今年 5 月，中國傳統汽車銷量下跌，比亞迪新能源汽車銷量則首度突破 4,000 輛，超越日產及特斯拉成為該月銷量排名第 1 位。

本站聲明:網站內容來源於EnergyTrend https://www.energytrend.com.tw/ev/,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※如何讓商品強力曝光呢? 網頁設計公司幫您建置最吸引人的網站，提高曝光率!!

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

域名解析 | A記錄，CNAME，MX，NS 你懂了嗎

發佈日期: 2020-06-10 作者: admin

域名解析 | A記錄，CNAME，MX，NS 你懂了嗎

域名解析

什麼是域名解析？域名解析就是國際域名或者國內域名以及中文域名等域名申請后做的到IP地址的轉換過程。IP地址是網路上標識您站點的数字地址，為了簡單好記，採用域名來代替ip地址標識站點地址。域名的解析工作由DNS服務器完成。

如下圖，百度 www.baidu.com 就是域名，解析出來的IP 14.216.177.30 這個過程就是域名解析。

A 記錄

A (Address) 記錄是用來指定主機名（或域名）對應的IP地址記錄。用戶可以將該域名下的網站服務器指向到自己的web server上。同時也可以設置您域名的二級域名。又稱IP指向，用戶可以在此設置子域名並指向到自己的目標主機地址上，從而實現通過域名找到服務器。
　　說明：
　　·指向的目標主機地址類型只能使用IP地址；
　　1) 添加A記錄
　　在“主機名”中填入子域的名字，“類型”為A，“IP地址/主機名”中填入web服務器的IP地址，點擊“新增”按鈕即可。
　　注：如果“主機名”一欄為空則表示對域名mydomain.com本身做指向。
　　2) 修改A記錄
　　只要在“IP地址/主機名”一欄中將原來的IP地址直接修改為新IP地址，然後點擊“修改”按鈕即可。
　　3) 刪除A記錄
　　點擊要刪除的A記錄後面對應的“刪除”按鈕即可。
　　4) 泛域名解析
　　即將該域名所有未指定的子域名都指向一個空間。
　　在“主機名”中填入*，“類型”為A，“IP地址/主機名”中填入web服務器的IP地址，點擊“新增”按鈕即可。
　　5) 負載均衡的實現：
　　負載均衡(Server Load Balancing，SLB)是指在一系列資源上面動態地分佈網絡負載。負載均衡可以減少網絡擁塞，提高整體網絡性能，提高自愈性，並確保企業關鍵性應用的可用性。
　　當相同子域名有多個目標地址時，表示輪循，可以達到負載均衡的目的，但需要虛擬主機服務商支持。

CNAME記錄

別名記錄。這種記錄允許您將多個名字映射到另外一個域名。通常用於同時提供WWW和MAIL服務的計算機。例如，有一台計算機名為“host.mydomain.com”（A記錄）。它同時提供WWW和MAIL服務，為了便於用戶訪問服務。可以為該計算機設置兩個別名（CNAME）：WWW和MAIL。這兩個別名的全稱就 http://www.mydomain.com/和“mail.mydomain.com”。實際上他們都指向 “host.mydomain.com”。通常稱別名指向。您可以為一個主機設置別名。比如設置test.mydomain.com，用來指向一個主機www.rddns.com那麼以後就可以用test.mydomain.com來代替訪問www.rddns.com了。
　　說明：
　　·CNAME的目標主機地址只能使用主機名，不能使用IP地址；
　　·主機名前不能有任何其他前綴，如：http://等是不被允許的；
　　·A記錄優先於CNAME記錄。即如果一個主機地址同時存在A記錄和CNAME記錄，則CNAME記錄不生效。
　　1) 添加CNAME記錄
　　在“主機名”中填入子域的名字，“類型”為CNAME，“IP地址/主機名”中填入目標地址，點擊“新增”按鈕即可。
　　2) 修改CNAME記錄
　　只要在“IP地址/主機名”一欄中將原來的目標地址直接修改為新地址，然後點擊“修改”按鈕即可。
　　3) 刪除CNAME記錄
　　點擊要刪除的CNAME記錄後面對應的“刪除”按鈕即可。

MX 記錄

郵件交換記錄。用於將以該域名為結尾的电子郵件指向對應的郵件服務器以進行處理。如：用戶所用的郵件是以域名mydomain.com為結尾的，則需要在管理界面中添加該域名的MX記錄來處理所有以@mydomain.com結尾的郵件。
　　說明：
　　·MX記錄可以使用主機名或IP地址；
　　·MX記錄可以通過設置優先級實現主輔服務器設置，“優先級”中的数字越小表示級別越高。也可以使用相同優先級達到負載均衡的目的；
　　·如果在“主機名”中填入子域名則此MX記錄只對該子域名生效。
　　1)添加MX記錄
　　“主機名”一欄為空，“類型”為MX，“IP地址/主機名”中填入目標地址或IP，“優先級”里填入数字（必須為整數），點擊“新增”按鈕即可。
　　2) 修改MX記錄
　　只要在“IP地址/主機名”一欄中將原來的目標地址或IP直接修改為新地址或IP，然後點擊“修改”按鈕即可。
　　3) 刪除MX記錄
　　點擊要刪除的MX記錄後面對應的“刪除”按鈕即可。
　　4) 負載均衡
　　服務器負載均衡(Server Load Balancing，SLB)是指在一系列資源上面智能地分佈網絡負載。負載均衡可以減少網絡擁塞，提高整體網絡性能，提高自愈性，並確保企業關鍵性應用的可用性。
　　當域名的MX記錄有多個目標地址且優先級相同時，表示輪循，可以達到負載均衡的目的，但需要郵箱服務商支持。

NS 記錄

解析服務器記錄。用來表明由哪台服務器對該域名進行解析。這裏的NS記錄只對子域名生效。例如用戶希望由12.34.56.78這台服務器解析news.mydomain.com，則需要設置news.mydomain.com的NS記錄。
　　說明：
　　·“優先級”中的数字越小表示級別越高；
　　·“IP地址/主機名”中既可以填寫IP地址，也可以填寫像ns.mydomain.com這樣的主機地址，但必須保證該主機地址有效。如，將 news.mydomain.com的NS記錄指向到ns.mydomain.com，在設置NS記錄的同時還需要設置ns.mydomain.com的指向，否則NS記錄將無法正常解析；
　　·NS記錄優先於A記錄。即，如果一個主機地址同時存在NS記錄和A記錄，則A記錄不生效。這裏的NS記錄只對子域名生效。
　　1) 添加NS記錄
　　在“主機名”中填入子域的名字，“類型”為NS，“IP地址/主機名”中填入解析服務器的IP地址或名稱（如ns.mydomain.com），點擊“新增”按鈕即可。
　　2) 修改NS記錄
　　只要在“IP地址/主機名”一欄中將原來的服務器目標地址或IP直接修改為新地址或IP，然後點擊“修改”按鈕即可。
　　3) 刪除NS記錄
　　點擊要刪除的NS記錄後面對應的“刪除”按鈕即可。

使用A記錄和CNAME進行域名解析的區別

A記錄就是把一個域名解析到一個IP地址（Address，特製数字IP地址），而CNAME記錄就是把域名解析到另外一個域名。其功能是差不多，CNAME將幾個主機名指向一個別名，其實跟指向IP地址是一樣的，因為這個別名也要做一個A記錄的。但是使用CNAME記錄可以很方便地變更IP地址。如果一台服務器有100個網站，他們都做了別名，該台服務器變更IP時，只需要變更別名的A記錄就可以了。

使用A記錄和CNAME哪個好？

域名解析CNAME記錄A記錄哪一種比較好？如果論對網站的影響，就沒有多大區別。但是：CNAME有一個好處就是穩定，就好像一個IP與一個域名的區別。服務商從方便維護的角度，一般也建議用戶使用CNAME記錄綁定域名的。如果主機使用了雙線IP，顯然使用CNAME也要方便一些。

A記錄也有一些好處，例如可以在輸入域名時不用輸入WWW.來訪問網站哦！從SEO優化角度來看，一些搜索引擎如alex或一些搜索查詢工具網站等等則默認是自動去掉WWW.來辨別網站，CNAME記錄是必須有如：WWW(別名)前綴的域名，有時候會遇到這樣的麻煩，前綴去掉了默認網站無法訪問。

有人認為，在SEO優化網站的時候，由於搜索引擎找不到去掉WWW.的域名時，對網站權重也會有些影響。因為有些網民客戶也是不喜歡多寫三個W來訪問網站的，網站無法訪問有少量網民客戶會放棄繼續嘗試加WWW.訪問域名了，因此網站訪問瀏覽量也會減少一些。

也有人認為同一個域名加WWW.和不加WWW.訪問網站也會使網站權重分散，這也是個問題。但是可以使用301跳轉把不加WWW.跳轉到加WWW.的域名，問題就解決了

本站聲明:網站內容來源於博客園,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※為什麼 USB CONNECTOR 是電子產業重要的元件?

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想要讓你的商品成為最夯、最多人討論的話題?網頁設計公司讓你強力曝光

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

高精地圖中地面標識識別技術歷程與實踐

發佈日期: 2020-06-10 作者: admin

導讀：本文將主要介紹高德在高精地圖地面標識識別上的技術演進，這些技術手段在不同時期服務了高精地圖產線需求，為高德地圖構建高精度地圖提供了基礎的技術保證。

1.面標識識別

地面標識識別，指在地圖道路中識別出各種類型的地面標識元素，如地面箭頭、地面文字、時間、地面数字、減速帶、車距確認線、減速丘、人行橫道、停止讓行線、減速讓行線等。這些自動化識別結果將作為生產數據交付給地圖生產產線，經過製作后演變成服務於自動駕駛、車載導航、移動導航的地圖。

高精地圖一般對各個地圖要素精度至少有着厘米級的要求，所以相對於普通地圖來說需要更高的位置精度，這也是與普通地圖識別的最大不同，所以探索如何將地面標識識別得又全又準是我們一直努力的方向。

地面標識識別有兩大難點：一是地面標識本身的種類、大小繁多，二是地面標識易被磨損遮擋，清晰度參差不齊，這給高精度識別帶來了巨大的挑戰。

1）地面標識種類繁多：實際場景中地面標識種類繁多，在內容、顏色、形狀、尺寸等方面均有不同分佈。

顏色：比如黃色、紅色、白色等

形狀：箭頭形、各種文字数字形狀、條形、多條形、面狀、丘狀等

尺寸：國標定義的標準箭頭長度為9m，但也存在1m~2m甚至1m以下的地面標識元素，尤其減速帶以及人行道等尺寸差異會更大，反映到圖像中像素個數以及長寬比均會有較大差異。

圖1. 部分地面標識

2）磨損壓蓋多：地面元素長年累月受車輛、行人等碾壓會造成磨損，以及經常存在的堵車等場景更是加大了地面要素被遮擋的可能。所以從激光雷達獲取的點雲數據和由相機獲取的可見光圖像數據的質量均參差不齊，對地面標誌識別帶來了極大的挑戰。

常見的問題如下所示，示例如圖2所示。

地面標識磨損：地面標誌由於磨損褪色、掉漆導致不完整或者嚴重不清晰

採集環境問題：遮擋(施工、車輛)、由於環境改變引起的材料激光反射率差異以及可見光不清晰（雨天、逆光等）

圖2. 自然場景下拍攝的地面標識

2. 識別起步

地面標識識別需要做的是將地面標識這部分區域提取出來，則最直觀的是對其進行閾值分割、骨架提取、連通域分析等傳統方法。首先獲取點雲中地面點集合，接着獲取集合中高反射率部分的骨架集合，然後對每個局部骨架區域計算強度截斷閾值，最後對區域進行連通區域搜索以及附加降噪措施等。

另外我們也嘗試了GrabCut等算法在地面標誌上的提取，GrabCut算法對前景和背景分別聚類，得到k組類似的像素集合，然後對前景和背景分別進行高斯混合模型（GMM）建模，判斷像素屬於地面標誌還是背景。在提取疑似地面標識區域后，再經過機器學習模型（SVM等）進行細分類以獲得更好的識別效果。

圖3. 傳統提取方法識別結果

由上圖可以看到，對於一些前後景區分比較好的地面標識提取的比較好，但是針對有磨損、模糊、前景背景相似、背景複雜等情況均效果欠佳，容易漏召回且位置精度不高，魯棒性不強。

3.深度學習時代

2012年Hinton團隊提出的Alexnet網絡贏得了2012年圖像識別大賽冠軍，相比傳統方法獲得顯著提升，CNN在圖像領域有了明顯優勢。近幾年，基於深度學習的檢測識別技術也得到了很大發展。

深度學習時代是數據和硬件驅動的時代，結合部分人工標註以及自動化生成，我們擁有百萬級的數據，而且各種場景的數據還在不斷豐富，結合算法探索與創新，我們取得了越來越好的技術與業務效果。

目前檢測識別技術主要分為兩大方向：Two-Stage(如RCNN系列)和One-stage(SSD、YOLO等)。Two-Stage網絡優勢在於效果整體較好，識別位置較精確，對小目標檢測也有一定的競爭力。

One-stage檢測識別方法優勢在於處理速度較快。高精地圖不僅需要較高的識別性能、也需要有足夠高的識別位置精度，所以我們選擇了準確率較高的Two-stage大方向。

1）R-FCN檢測

結合位置敏感得分圖（position-sensitive score map）和位置敏感降採樣（position-sensitive roi pooling）等操作，R-FCN算法在目標檢測識別上獲得了較高的性能和位置精度，我們選擇了R-FCN檢測算法實現對地面標識的檢測識別。

R-FCN算法基於深度學習的方法，通過學習大量實際場景樣本，所以在泛化性上取得了比較大的提升，自動化識別對於不同場景的識別能力有所提高，地面標識召回率得到了較大的改善。算法示意圖如下所示：

圖4. R-FCN算法示意圖

以下為一些地面標識檢測識別示例：

圖5. R-FCN算法地面標識識別示例

引入深度學習極大的改善了高精地圖地面標識自動識別的性能，地面標識召回得到了很大提升，美中不足的是R-FCN存在着一個弊端就是其輸出的最終檢測位置是基於地面標識類別的得分，但往往得分最高的位置並不一定跟實際位置最貼合，所以在位置預測精度上，R-FCN並不完美。

2）級聯檢測器

隨着深度學習的發展以及業界對目標檢測識別位置精度的要求不斷提高，更多高精度檢測識別算法被提了出來，如Iou-Net等。

我們適時採用了更加先進的識別算法，以期獲得更加精準的位置精度來滿足產線業務需求，結合級聯檢測，利用Deformable-Conv自適應感受野等技術提升算法識別精度。

該算法不同於傳統算法對roi進行一次預測回歸得到最終位置，而是通過級聯的形式不斷修正預測的位置和實際位置的偏差，每經過一個級聯回歸器，算法識別結果均會更加貼合真值，這非常有利於提高識別精度，契合高精地圖對目標位置精度的高要求，最後在召回和位置精度上都達到更好的效果。

圖6.級聯檢測算法原理圖

以下為一些算法識別結果示例：

圖7. 級聯檢測算法識別示例

通過引入級聯形式的檢測識別模型令高精產線自動識別能力在識別精度上得到了不錯的提升，但我們對自動識別位置精度提升的挖掘是無止盡的，所以有了以下的方案。

3）級聯檢測 + 局部回歸

設想一下，如果我們在地面標識區域進行局部的位置回歸，那麼網絡就能夠聚焦到更加細微的地面標識區域，最終得到更加接近邊界的位置。結合實際在做地面標誌識別時，我們將容易造成精度問題的部分單獨做位置精修，得到了更加精細的位置。

以下為部分算法識別結果示例：

圖8. 算法識別示意圖

採用檢測+回歸技術方案實現了更加好的位置檢測精度，讓我們離“真實世界”更進了一步。其缺點是技術方案流程較長，不夠簡潔美觀。

4）基於角點的檢測

基於角點回歸的目標檢測方法，使用單個卷積神經網絡預測兩組熱力圖來表示不同物體類別的角的位置，即將目標邊界框檢測為一對關鍵點（即邊界框的左上角和右下角），以及每個檢測到的角點的嵌入向量。其中角點用於確定目標位置，嵌入向量用於對屬於同一目標的一對角點進行分組。

此種方法簡化了網絡的輸出，通過將目標檢測為成對關鍵點，消除了現有的檢測器設計中對特徵層需要大量anchors的弊端，因為大量anchors造成了大量的重疊以及正負樣本不均衡。同時為了產生更緊密的邊界框，網絡還預測偏移以精細調整角點的位置。通過預測熱力圖、嵌入向量、以及偏移最終得到了精確的邊界框。

圖 9 角點檢測示意圖

由於在檢測任務中需要獲取相同尺寸的特徵圖對目標進行位置回歸、類別分類等，算法會對其進行量化以及降採樣等操作，不可避免會有精度上的損失。這個弊端帶來的最大影響就是經由檢測回歸出的位置不夠魯棒，在某些情況下會出現或多或少的偏移。

5）級聯檢測 + 分割精修

隨着語意分割技術的不斷成熟，基於深度學習的語意分割已經能夠將輸入圖像進行像素級的分類，而且其精度也越來越高，也就是圖片中要素的輪廓越來越精細。

我們採用以resnet 為主幹的分割模型，並結合了自適應感受野、多尺度融合、Coarse-Fine融合、感興趣區域注意力機制等技術實現了對地面標識的像素級分割。

為了獲取地面標識的實體信息，我們仍然用檢測來確定地面標識大致位置，但是不同的是最終由對應區域的地面標識分割語義信息獲取最終精確的地面標識位置。

圖10.地面標識分割示意圖

以下為部分檢測結合精修示例圖：

圖11. 分割精修示例

語義分割的引入使得地面標識的識別位置精度得到了改善，解決了由檢測帶來的識別位置精度不魯棒的問題，使得高精地圖地面標識自動化效果上了一個新的台階。

但是這種方法稍顯繁瑣，而且檢測和分割任務都需要耗費大量GPU資源，也就是說一張圖片需要同時多次GPU運算加上後續的CPU后處理融合才能夠得到最終的結果，如果能夠將這些步驟優化，那麼必然能夠簡化流程同時節省大量運算資源。

6）PAnet

基於以上考慮，我們採用了基於PAnet的檢測識別算法。傳統的實例分割模型各層中的信息傳播不夠充分。PAnet較好的解決了這些問題，充分融合了coarse、fine特徵，不僅有自頂向下的特徵融合還結合了自底向上的特徵融合，在高層特徵中充分融合進了底層的強定位特徵，解決了淺層特徵信息丟失的問題。

另外還結合了自適應特徵降採樣將不同特徵層進行融合提取roi特徵做預測，以及添加額外mask前景背景分類分支，使得預測mask更加精確，這些手段結合對於目標檢測位置精度有比較大的收益。同時，分割和檢測任務結合能夠互相促進取得更好的結果。

圖 12 PAnet 示意圖

以下為一些算法的識別結果示例。可以看到算法對部分磨損模糊的地面標識也有了一定的寬容度，其位置精度有了巨大的改善。（圖中地面標識外框為檢測得到的大概位置，內框為根據像素級分割得到的位置，取內框為地面標識最終位置）。

圖 13 檢測識別實例

採用上述方案需要將點雲投影為2D空間，中間有一定的歸一化量化操作，不可避免的會損失一些信息，最直觀的是在一些點雲反射率較低的地方容易造成目標丟失。如果能夠在原始3維點雲上提取那麼這些問題就迎刃而解。

7）基於3維點雲的目標檢測

基於上面的考慮，我們探索原始點雲上的3D物體檢測，3D點雲識別是各種真實世界應用的一個重要組成部分，如自主導航、重建、VR/AR等。與基於圖像的檢測相比，激光雷達提供可靠的深度信息，可以用於精確定位物體並表徵它們的形狀。

我們探索了多種3維點雲識別算法，比如基於bird-view、voxel等的3維點雲識別。由於PointRCNN在原始3維點雲目標檢測上的良好表現，我們採用基於PointRCNN的方法提取地面標識，整個檢測框架包括兩個階段：第一階段將整個場景的點雲分割為前景點和背景點，以自下而上的方式直接從點雲生成少量高質量的3D proposal。

第二階段在規範坐標中修改候選區域獲得最終的檢測結果，將每個proposal經池化後轉換為規範坐標，以便更好地學習局部空間特徵，同時與第一階段中全局語義特徵相結合，用於預測Box優化和置信度預測。

圖 14 3維點雲檢測

4. 效果與收益

大數據的支撐使得我們的算法擁有更好的魯棒性與識別能力。結合算法中各種策略以及多種數據源（點雲、可見光等），我們在不斷提升地面標識識別精度，其位置精度在Ground Truth 5cm範圍區間內達到99%以上，召回也達到了99.99%以上，各項指標都得到了穩步提升。

上述方案已經正式上線，並處理了大量數據，准召率都達到了生產作業的要求，同時算法對人工作業產線的效率提升作用日益提高。以下是部分效果圖：

圖15. 地面標識檢測效果圖

5. 寫在最後

高精地圖被稱作自動駕駛系統的“眼睛“，與普通地圖最大的不同點在於使用主體不同。普通導航地圖的使用者是人，用於導航、搜索，而高精地圖的使用者是計算機，用於高精度定位、輔助環境感知、規劃與決策。因而高精地圖對地圖要素不僅需要極高的召回率，還需要非常高的位置精度。

高精地圖中要素的識別對技術提出了比較高的要求，縱觀整個高精地圖產業發展，地圖製作逐漸從純人工過渡到半自動乃至全自動。期間識別技術也不斷得到發展與完善，從手動構造特徵到自動特徵、從2維識別到3維以及更高維識別、從單源識別到多源融合等。

目前，高精地圖多採用人工作業，人工作業質量和效率始終是一個矛盾點，相比之下，機器自動識別有着更高的效率、更低的作業成本以及不亞於人工的作業質量。自動識別的應用必將加速高精地圖構建，推動高精地圖產業發展。高精度地面標識識別技術已經在高德高精地圖內部得到應用，有效提升了數據製作效率與製作質量，為高德構建高精地圖提供堅實的技術支撐。

本站聲明:網站內容來源於博客園,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※如何讓商品強力曝光呢? 網頁設計公司幫您建置最吸引人的網站，提高曝光率!!

※網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司，幫您輕鬆架站!

※想知道最厲害的台北網頁設計公司推薦、台中網頁設計公司推薦專業設計師”嚨底家”!!

Table of Contents

1 JavaScript 基礎

1.1 JavaScript 簡介

1.1.1 Web 腳本編程基礎

1.2 創建簡單的腳本

1.2.1 在 Web 頁面里添加 JavaScript

1.2.2 編寫 JavaScript 語句

1.2.3 變量

1.2.4 操作符

1.2.5 捕獲鼠標事件

1.3 使用函數

1.3.1 基本語法

1.3.2 調用函數

1.4 函數的更多知識

1.4.1 變量作用域

1.4.2 箭頭函數

1.4.3 設置默認參數

1.5 DOM 對象和內置對象

1.5.1 與用戶交互

1.5.2 根據 id 選擇元素

1.5.3 訪問瀏覽器歷史記錄

1.5.4 使用 location 對象

1.5.5 日期和時間

2 JavaScript 編程

2.1 数字和字符串

2.1.1 數值

2.1.2 全局方法

2.1.3 Number 對象

2.1.4 Number() 函數

2.1.5 布爾值

2.1.6 null(空) 和 undefined(未定義)

2.2 操作字符串

2.2.1 字符串

2.2.2 模板字符串

2.3 數組

2.3.1 數組

2.3.2 如何遍曆數組

2.3.3 三點表示法

2.4 用 JavaScript 處理事件

2.4.1 事件的類型

2.4.2 事件處理器

2.4.3 event 對象

2.5 程序控制

2.5.1 條件語句

2.5.2 循環和控制結構

2.5.3 設置和使用定時器

3 理解 JavaScript 對象

3.1 面向對象編程

3.1.1 什麼是面向對象編程

3.1.2 創建對象

3.1.3 用 prototype 擴展和繼承對象

3.1.4 封裝

3.2 對象進階

3.2.1 類

3.2.2 對象繼承

3.2.3 使用功能檢測

3.3 DOM 腳本編程

3.3.1 DOM 節點

3.3.2 用 getElementsByTagName() 選擇元素

3.3.3 讀取元素的屬性

3.3.4 Mozilla 的 DOM 查看器

3.4 JSON 簡介

3.4.1 JSON 是什麼

3.4.2 訪問 JSON 數據

3.4.3 JSON 的數據序列化

3.4.4 JSON 數據類型

3.4.5 模擬關聯數組

3.4.6 使用 JSON 創建對象

3.4.7 JSON 安全性

4 用 JavaScript 操作 Web 界面

4.1 HTML 與 JavaScript 編程

4.1.1 HTML5 的新標籤

4.1.2 一些重要的新元素

4.1.3 拖放

4.1.4 本地存儲

4.1.5 操作本地文件

4.2 JavaScript 和 CSS

4.2.1 CSS 簡介

4.2.2 DOM 的 style 屬性

4.2.3 用 className 訪問類

域名解析 | A記錄，CNAME，MX，NS 你懂了嗎