對TypeScript進行研究

1.npm install -g typescript

在編輯器,將下面的代碼輸入到greeter.ts文件里:

function greeter(person) {return "Hello, " + person; } let user = "Jane User"; document.body.innerHTML = greeter(user);

我們使用了.ts擴展名,但是這段代碼僅僅是JavaScript而已。 你可以直接從現有的JavaScript應用里復制/粘貼這段代碼。

在命令行上,運行TypeScript編譯器:

tsc greeter.ts

輸出結果為一個greeter.js文件,它包含了和輸入文件中相同的JavsScript代碼。 一切準備就緒,我們可以運行這個使用TypeScript寫的JavaScript應用了!

接下來讓我們看看TypeScript工具帶來的高級功能。 給?person函數的參數添加: string類型注解,如下:

function greeter(person: string) { return "Hello, " + person; } let user = "Jane User"; document.body.innerHTML = greeter(user);

類型注解

TypeScript里的類型注解是一種輕量級的為函數或變量添加約束的方式。 在這個例子里,我們希望?greeter函數接收一個字符串參數。 然后嘗試把?greeter的調用改成傳入一個數組:

function greeter(person: string) { return "Hello, " + person; } let user = [0, 1, 2]; document.body.innerHTML = greeter(user);

重新編譯,你會看到產生了一個錯誤。

greeter.ts(7,26): error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'string'.

似地,嘗試刪除greeter調用的所有參數。 TypeScript會告訴你使用了非期望個數的參數調用了這個函數。 在這兩種情況中,TypeScript提供了靜態的代碼分析,它可以分析代碼結構和提供的類型注解。

要注意的是盡管有錯誤,greeter.js文件還是被創建了。 就算你的代碼里有錯誤,你仍然可以使用TypeScript。但在這種情況下,TypeScript會警告你代碼可能不會按預期執行。

接口

讓我們開發這個示例應用。這里我們使用接口來描述一個擁有firstNamelastName字段的對象。 在TypeScript里,只在兩個類型內部的結構兼容那么這兩個類型就是兼容的。 這就允許我們在實現接口時候只要保證包含了接口要求的結構就可以,而不必明確地使用?implements語句。

?

interface Person { firstName: string; lastName: string; } function greeter(person: Person) { return "Hello, " + person.firstName + " " + person.lastName; } let user = { firstName: "Jane", lastName: "User" }; document.body.innerHTML = greeter(user);

最后,讓我們使用類來改寫這個例子。 TypeScript支持JavaScript的新特性,比如支持基于類的面向對象編程。

讓我們創建一個Student類,它帶有一個構造函數和一些公共字段。 注意類和接口可以一起共作,程序員可以自行決定抽象的級別。

還要注意的是,在構造函數的參數上使用public等同于創建了同名的成員變量。

class Student { fullName: string; constructor(public firstName, public middleInitial, public lastName) { this.fullName = firstName + " " + middleInitial + " " + lastName; } } interface Person { firstName: string; lastName: string; } function greeter(person : Person) { return "Hello, " + person.firstName + " " + person.lastName; } let user = new Student("Jane", "M.", "User"); document.body.innerHTML = greeter(user);

重新運行tsc greeter.ts,你會看到生成的JavaScript代碼和原先的一樣。 TypeScript里的類只是JavaScript里常用的基于原型面向對象編程的簡寫。

運行TypeScript Web應用

greeter.html里輸入如下內容:

<!DOCTYPE html>
<html><head><title>TypeScript Greeter</title></head> <body> <script src="greeter.js"></script> </body> </html>

?

等等

?

?

?

?

?

轉載于:https://www.cnblogs.com/zhouyideboke/p/11346873.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/247163.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/247163.shtml
英文地址,請注明出處:http://en.pswp.cn/news/247163.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

caffe 提取特征并可視化(已測試可執行)及在線可視化

網絡結構在線可視化工具 http://ethereon.github.io/netscope/#/editor 參考主頁&#xff1a; caffe 可視化的資料可在百度云盤下載 鏈接: http://pan.baidu.com/s/1jIRJ6mU 提取密碼&#xff1a;xehi http://cs.stanford.edu/people/karpathy/cnnembed/ http://lijianch…

ncnn:提取所有層特征值

官方代碼托管地址&#xff1a;https://github.com/Tencent/ncnn 在Extractor類中添加以下方法&#xff1a; int Extractor::extract_all_blobs() {for (int blob_index 0; blob_index < blob_mats.size(); blob_index){Mat outMat;extract(blob_index, outMat);// write to…

Caffe + Ubuntu 15.04/16.04 + CUDA 7.5/8.0 在服務器上安裝配置及卸載重新安裝(已測試可執行)

本文參考如下: caffe 安裝所需的所有資源可在百度網盤下載 鏈接: http://pan.baidu.com/s/1jIRJ6mU 提取密碼&#xff1a;xehi 在服務器上為每個子用戶拷貝caffe 使用 Linux探索之旅 | 第一部分第四課&#xff1a;磁盤分區完成Ubuntu安裝 Ubuntu16.04 1080Ti深度學習環境配…

ASP.NET MVC Action向視圖傳值之匿名類型

在使用ASP.NET MVC過程中想必大家都有遇到過一個問題就是我們的Action如何向視圖傳遞匿名類型的值呢&#xff0c;如果不做特殊處理則無法實現。 接下來我們來看一個示例&#xff1a; 在我們的控制中&#xff1a; using System.Collections.Generic; using System.Web.Mvc;names…

2015倫敦深度學習峰會筆記(轉載)

摘要&#xff1a;在倫敦舉行的第三屆深度學習峰會由RE.WORK主辦&#xff0c;匯集了從工業領域到學術領域不同背景的專業人士&#xff0c;本文是該峰會第一天的筆記。包括Koray Kavukcuoglu、Sander Dieleman等知名深度學習專家分享了自己的經驗。上周&#xff0c;我有機會參加在…

[webrtc] rtcp模塊中rtt時間計算

RTT指 round-trip time&#xff0c;即計算AB兩端的往返時延 這里可以分成兩個問題&#xff1a; 如何在A端估算A和B之間的RTT時間? 如何在B端估算A和B之間的RTT時間? 本文參考資料:rfc 3550rfc 3611webrtc issue https://code.google.com/p/webrtc/issues/detail?id1613以及解…

Deep learning Reading List

本文轉自&#xff1a; http://jmozah.github.io/links/ http://www.datakit.cn/blog/2014/12/31/Deep_learning_Reading_List.html 文章來自J Mohamed Zahoor的深度學習閱讀書單。 Following is a growing list of some of the materials i found on the web for Deep Learning…

商戶網站使用第三方支付的大致原理和實現

如果把商戶網站使用第三方支付平臺(比如支付寶)的原理搞清楚&#xff0c;那編程就變得簡單多了。 整個過程大致這樣&#xff1a; 1、商戶與支付寶簽約。2、在商戶網站購買商品&#xff0c;填寫數量&#xff0c;確定購買后跳轉到結賬頁面。結賬頁面可能包括訂單號、定單狀態(已支…

Awesome Deep Vision

本文轉自&#xff1a;https://github.com/kjw0612/awesome-deep-vision http://jiwonkim.org/awesome-deep-vision/ A curated list of deep learning resources for computer vision, inspired by awesome-php and awesome-computer-vision. Maintainers - Jiwon Kim, Heesoo …

GitHub 新出的 Actions 是什么? 用他做自動測試?

體驗分享 本文一個嘗鮮的體驗分享, 并沒有太復雜的技巧, 做了一個最少代碼的例子展示, 讓每個人都可以把action用起來, 如果路過的大牛有高級技巧請留言分享, 我會補充. 下面正文開始. 是什么? 是一個免費的操作系統容器(Linux/Windows/macOS), 我們可以讓他預裝開發環境(node…

caffe框架翻譯-理解(轉載)

本文轉自&#xff1a; http://dirlt.com/caffe.html http://blog.csdn.net/songyu0120/article/details/468170851 caffe http://caffe.berkeleyvision.org/ 1.1 setup 安裝需要下面這些組件。這些組件都可以通過apt-get獲得。 libgoogle-glog-dev # gloglibgflags-dev # gfla…

賈揚清分享_深度學習框架caffe

本文轉自&#xff1a; http://www.datakit.cn/blog/2015/06/12/online_meet_up_with_yangqing_jia.html http://www.ifight.me/187/ Caffe是一個清晰而高效的深度學習框架&#xff0c;其作者是博士畢業于UC Berkeley的 賈揚清&#xff0c;目前在Google工作。本文是根據機器學習…

iOS多線程理解

在iOS開發中&#xff0c;線程的創建與管理已經被Apple進行了很好的封裝&#xff0c;但是在開發者實際開發中會濫用GCD,導致整個代碼混亂不堪&#xff0c;因此在這里需要對iOS開發中的多線程開發進行整理。 1. 主線程完成耗時操作&#xff0c;會導致UI卡頓&#xff0c;因此耗時…

Java生鮮電商平臺-SpringCloud微服務架構中分布式事務解決方案

Java生鮮電商平臺-SpringCloud微服務架構中分布式事務解決方案 說明&#xff1a;Java生鮮電商平臺中由于采用了微服務架構進行業務的處理&#xff0c;買家&#xff0c;賣家&#xff0c;配送&#xff0c;銷售&#xff0c;供應商等進行服務化&#xff0c;但是不可避免存在分布式事…

批量提取 caffe 特征 (python, C++, Matlab)(待續)

本文參考如下&#xff1a; Instant Recognition with Caffe Extracting Features Caffe Python特征提取 caffe 練習4 —-利用python批量抽取caffe計算得到的特征——by 香蕉麥樂迪 caffe 練習3 用caffe提供的C函數批量抽取圖像特征——by 香蕉麥樂迪 caffe python批量抽…

iOS單例初步理解

iOS單例初步理解 在iOS開發中&#xff0c;系統自帶的框架中使用了很多單例&#xff0c;非常方便用戶&#xff08;開發者&#xff0c;使用比如[NSApplication sharedApplication] 等&#xff09;&#xff0c;在實際的開發中&#xff0c;有時候也需要設計單例對象&#xff0c;為…

python面向對象之類的成員

面向對象之類的成員 細分類的組成成員 類大致分為兩塊區域&#xff1a; 第一部分&#xff1a;靜態字段 第二部分&#xff1a;動態方法 class Animal:type_name "動物類" # 靜態變量&#xff08;靜態字段&#xff09;__feature "活的" # 私有靜態變量…

python元類、反射及雙線方法

元類、反射及雙線方法 元類 print(type(abc)) print(type(True)) print(type(100)) print(type([1, 2, 3])) print(type({name: 太白金星})) print(type((1,2,3))) print(type(object))class A:passprint(isinstance(object,type)) print(isinstance(A, type)) type元類是獲取該…

iOS中的多線程一般使用場景

在IOS開發中為提高程序的運行效率會將比較耗時的操作放在子線程中執行&#xff0c;iOS系統進程默認啟動一個主線程&#xff0c;用來響應用戶的手勢操作以及UI刷新&#xff0c;因此主線程又叫做UI線程。 前面的Blog說明了NSThread以及GCD處理并發線程以及線程安全&#xff08;線…

iOS中如何優化Cell中圖片的下載性能

在iOS開發中使用最為常見的是UITableView&#xff0c;其中UITabelViewCell中下載圖片&#xff0c;會影響用戶下拉刷新UI,導致卡頓&#xff0c;用戶體驗不好&#xff0c;在這篇blog中&#xff0c;我將以一個例子來說明如何優化UITableView下載圖片 1.使用懶加載方式&#xff0c…