javascript/ES6/TypeScript/Juqery/Jquery-ui语法相关笔记

整日游离于C/C++/C#/TS/JS/pyton/SQL之间，还有一堆框架，整我的都快魔怔了! （学不动党表示人间不值得！）

备查笔记，记录一些Web脚本相关的语法和特性，随缘更新法

 

Q.javascript的类/静态函数/成员变量/成员等实现方式

虽然只有是个正经公司都开始用typescript或ES6了，可是原生js的闭包和原型链概念仍是有必要搞清楚滴.

 

1.class相关：

　　 1.0：类的实现方式（闭包和原型链）:

　　　　wait

 　　1.1 成员变量/函数：

　　　　wait

　　 1.2 静态函数/变量:

　　　　wait

　　 1.3 Javascript继承:

　　　　wait

 

Q.javascript 模版字符串新语法糖：

跟C#的新字符串语法糖相似.

let testobj = {str : 'hello world.'};
let str = `$hi, ${testobj.str} `;
console.log(str);

 

Q.javascript(js)的三个点(...)运算符：

1.spread运算:

　　语法糖，可快速向数组添加数组:

　　

let arr = [{id :'a'},{id :'b'},{id :'c'}];  
let arr1 = [{id :'d'},{id :'e'},{id :'f'}];
/**
* arr新的数据为：[{"id":"a"},{"id":"b"},{"id":"c"},{"id":"d"},{"id":"e"},{"id":"f"}]；
**/

2.可变函数参数,rest运算:

　　函数参数动态化：

　　跟c++的(...)和C#的params object[]同样的东西.都是用于可变参数(C++还能够用于可变模板类型数)：

function test(...aaa){console.log(aaa);}
test('a',12312,{id :1231});

///aaa的数据结构为：["a", 12312, {id:1231}]

 

3.JavaScript深拷贝:

　　之前作深拷贝要么用JSON.stringify和JSON.parse，要么本身扩展clone函数遍历属性

　　如今能够用ES6的(...)语法，实现深拷贝：

let t = {id: 1};
let t1 = {...t};
t.id = 10000;

console.log('t:', t,'t1:' t1);
/**
* t = {id:10000};t1 = {id:1};   
*/

 

Q.Vue下的TypeScript 编程报 没法调用类型缺乏调用签名的表达式。类型“VueRouter”没有兼容的调用签名。(TS2349)：

 

如vue-Router

 

declare interface Vue {
$router: (options?: any) => VueRouter
}

 

Q.Vue下的TypeScript 编程报 Syntax Error: Unexpected token：

一般是引用脚本是没注意.

须要指定lang="ts"才行 例如：

<script lang="ts" src="./index.ts"></script>

Q.TypeScript的Jquery和JqueryUI：

虽然有

@types/Jquery

@types/jqueryui

这俩个包，可是仍是以为直接引用脚本比较方便。

 

以Vue+TypeScript为例。

在Vue-Cli脚手架下的

首先，在Index.html 里添加

    <!-- jquery ui -->
    <link rel="stylesheet" href="./static/lib/JqueryUI/jquery-ui.min.css">
    <script src="./static/lib/JqueryUI/jquery-2.2.4.min.js"></script>
    <script src="./static/lib/JqueryUI/jquery-ui.min.js"></script>
    <!-- jquery ui -->

而后，须要用到的Ts或gobal.d.ts文件里添加如下代码（其余全局对象同理如Moment.js）：

declare const $:any;

 如今，就能够在TS里使用$进行Dom操做了