#typescript #javascript

Typescript类-转换学习

#TypeScript typescript作为微软实现的js的超集. 在类的实现，有如传统语言一样简单， 例子：官方 //.ts class Greeter { greeting: string; constructor(message: string) { this.greeting = message; } greet() { return "Hello, " + this.greeting; } }//.js var Greeter = (function () { function Greeter(message) { this.greeting = message; } Greeter.prototype.greet = function () { return "Hello, " + this.greeting; }; return Greeter; }()); 说道理，ts文件最终还是要变成js文件，所以，在我看来， 这似乎是，学习如何写，js 类 的方法。 上面是一个类，的，写法 //.ts class Animal { constructor(public name: string) { } //默认 为 0 move(distanceInMeters: number = 0) { console. ...

#javascript

Js - Module模式 - 私有-公有-命名空间

在javascript中没有真正意义的‘私有’，因为不像传统语言- js 没有访问修饰符。从技术上来说，我们不能称变量为公有或私有. 因此我们需使用函数作用域来模拟这个概念。 由于闭包的存在，声明的变量和方法只在该模式内部可用， 但在返回对象上的定义的变量和方法，则对外部使用者都是可用的。 var testModule = (function () { //私有变量 var myPrivateVar = 0; //记录所有参数的私有函数 var myPrivateMethod = function(bar){ console.log(bar); } return { //公有变量 myPublicVar : "foo", //调用私有变量和方法的公有函数 myPublicFunction: function(bar){ //增加私有计数器值 myPrivateVar++; console.log(myPrivateVar); //传入bar调用私有方法 myPrivateMethod(bar); } }; })(); console.log(testModule); //用公有变量传值公有函数 testModule.myPublicFunction(testModule.myPublicVar); 输出 { myPublicVar: 'foo', myPublicFunction: [Function: myPublicFunction] } 1 foo 可以看到，testModule 返回 1个函数,1个变量,但是，并没有myPrivateVar变量。 却可以，通过两个函数来操控，myPrivateVar表现得就像一个私有变量。

#javascript

js原型与构造

#对象／构造／原型 对象 – 原型 all 浏览器 获取原型方法 var a = {}; //a.prototype 无法获取——原型 a.constructor.prototype;// Object {} a.constructor// function Object() { [native code] } 函数 – 构造 + 原型 var a = function(){}; //函数可以直接 prototype a.prototype// Object {}; a.constructor// function Function() { [native code] } 上面可以看出，构造都是函数 对象 > 构造函数 > 函数 。。 var b = {}; b// Object {} b. ...

#canvas #html5

translate与rotate

translate与rotate 标签：html5，canvas 目录： - translate - rotate - 关系 一：translate translate 在 canvas中定义了，画框的位置 比如 <canvas id="myCanvas" style="border: 1px solid #d3d3d3;" width="300" height="150"> <script>; var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.fillRect(10, 10, 100, 50); ctx.translate(150, 75); ctx.fillRect(10, 10, 100, 50); </script></canvas>; > 定义一个宽300px，高150px的画布 在画布的(10,10)坐标上，画一个矩形》》ctx.fillRect(10, 10, 100, 50); translate(150,75)命令 就会在，已初始画布的基础上，向下移动150px，和向右移动75px 此时，如果再画一个矩形，那么，位置，也会发生改变 画布并没有改变，但是，观察画布的位置发生了变化 我们重新，以(150,75)定义为左上角(0,0)的新观察窗口 二：rotate <canvas id="myCanvas" style="border: 1px solid #d3d3d3;" width="300" height="150"> <script> var c = document. ...