typescript content

Author: mostafa6765

_data/toc.yaml

@@ -204,6 +204,24 @@ es6:
   - path: /javascript-developer/es/resource/
     title: resources
 
+typescript:
+- sectiontitle:
+  section:
+    - path: /javascrip-developer/typescript/
+      title: Typescript intro
+    - path: /javascrip-developer/typescript/types/
+      title: Type
+    - path: /javascrip-developer/typescript/enum/
+      title: Enum
+    - path: /javascrip-developer/typescript/type-alias/
+      title: Type alias
+    - path: /javascrip-developer/typescript/generic/
+      title: Generic
+    - path: /javascrip-developer/typescript/decorator/
+      title: Decorator
+    - path: /javascrip-developer/typescript/resources/
+      title: Resources
+
 
 vue:
 - sectiontitle: Basic React

javascript-developer/typescript/decorator.md

@@ -1,15 +1,54 @@
 ---
-description: decorator typescript
+description: A decorator is a function that takes in a target object.
 keywords: node.js, js, typescript, ts
-title: decorator typescript
+title: typescript decorator
 toc_max: 4
 ---
 
 ## decorator
 
+In TypeScript, a decorator is a function that takes in a target object (such as a class, method, or property) and returns a new object with the same structure, but possibly enhanced with additional features. Decorators are a language feature that allows you to annotate and modify classes and class members at design time.
+
+
+
 `@` represent decorator `@test`
 
+# method decorator
+
+```ts
+function auth(){
+    return function (target: any, key: any, descriptor: PropertyDescriptor){
+        let fn = descriptor.value
+        let isAuth: boolean = false
+        if (isAuth){
+            descriptor.value = (...args: any) => {
+                let f = fn(...args)
+                return f
+            }
+        } else {
+            descriptor.value = () => {
+                return "login required"
+            }
+        }
+    }
+}
+
+class User{
+    @auth()
+    profile(name: string){
+        return("profile: " + name)
+    }
+}
+
+let user: any = new User()
+console.log(user.profile('kamal'))
+```
+
 # resources 
 
-* https://www.typescriptlang.org/docs/handbook/decorators.html
-* https://gist.github.com/remojansen/16c661a7afd68e22ac6e
+* [decorator official](https://www.typescriptlang.org/docs/handbook/decorators.html)
+* [gist remojansen](https://gist.github.com/remojansen/16c661a7afd68e22ac6e)
+* [class decorator](https://dev.to/danywalls/decorators-in-typescript-with-example-part-1-m0f)
+* [decorator youtube - Ben Awad ***
+](https://www.youtube.com/watch?v=bRAcWk9S-6g)
+* [decorator codeburst ***](https://codeburst.io/decorate-your-code-with-typescript-decorators-5be4a4ffecb4)

javascript-developer/typescript/resources.md

@@ -0,0 +1,23 @@
+---
+description: Typescript best resources lists.
+keywords: node.js, js, typescript, ts
+title: Typescript resources
+toc_max: 4
+---
+
+# documentations and contents
+
+* [official doc](https://www.typescriptlang.org/docs/handbook/classes.html)
+* [playground](https://www.typescriptlang.org/play)
+* [educative](https://www.educative.io/blog/typescript-tutorial)
+* [typescripttutorial](https://www.typescripttutorial.net/typescript-tutorial/typescript-object-type/)
+* [cheatsheet by rmolinamir](https://github.com/rmolinamir/typescript-cheatsheet)
+
+
+## Video
+
+* [TheNetNinja](https://www.youtube.com/playlist?list=PL4cUxeGkcC9gUgr39Q_yD6v-bSyMwKPUI)
+
+* <a href="https://www.youtube.com/playlist?list=PLzvRQMJ9HDiQyjtcrtvDkeQMJIrv5ABbm" target="_blank">Video Tutorial</a>
+
+* <a href="https://www.youtube.com/playlist?list=PL6tu16kXT9Pp6XV3L3lrWideBW6Mcwaa5" target="_blank">Video Tutorial 2</a>

javascript-developer/typescript/types.md

@@ -24,10 +24,23 @@ let isResult: string = `welcome to ${isDanger}`;
 let isDanger: number[] = [1, 3, 5, 7];
 let isDanger: Array<number> = [1, 3, 5, 7];
 
+# Array of objects
+let employees: Array<{name: string, age: number, [key: string]: any}> = [
+  { name: 'kamal', age: 26 },
+  { name: 'mostafa', age: 21}
+]
+
+# Array of objects
+let employees: {name: string, age: number}[] = [
+  { name: 'kamal', age: 26 },
+  { name: 'mostafa', age: 21}
+]
+
 # any
 let isDanger: any = "this is kamal"
 ```
 
 # resources 
 * [typescripttutorial](https://www.typescripttutorial.net/typescript-tutorial/typescript-object-type/)
+* [array of objects stackoverflow](https://stackoverflow.com/questions/35435042/how-can-i-define-an-array-of-objects)
 * <a href="https://youtu.be/Q6pePpv-C-E" target="_blank">Video Tutorial</a>