├── helper.js
├── lib.js
├── index.html
└── script.js
/helper.js:
--------------------------------------------------------------------------------
1 | const fileName = 'helper';
2 | export default fileName;
3 |
--------------------------------------------------------------------------------
/lib.js:
--------------------------------------------------------------------------------
1 | import fileName from './helper.js';
2 | export const libName = 'es6-lib';
3 |
4 | const login = () => {
5 | console.log(fileName);
6 | };
7 |
8 | export default login;
9 |
10 | // console.log(libName);
11 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | ES6
8 |
9 |
10 |
11 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/script.js:
--------------------------------------------------------------------------------
1 | // ES6 AKA Ecmascript 2015
2 | // let const
3 | // var productName = 'Laptop';
4 | // code polute
5 |
6 | // function register() {
7 | // var username = 'rakesh';
8 | // var password = 'secret';
9 | // }
10 |
11 | // console.log(username);
12 |
13 | // let product = 'Laptop';
14 |
15 | // console.log(product);
16 | // const product = 'Laptop';
17 | // product = 'Mobile';
18 | // let age = 20; // undefined
19 | // console.log(age);
20 |
21 | // const age = {
22 | // years: 19,
23 | // };
24 | // age = 20;
25 |
26 | // console.log(age);
27 | // Arrow functions
28 | // function greet() {
29 | // console.log('Good morning');
30 | // }
31 |
32 | // const addition = a => console.log(a + a);
33 | // addition(5);
34 |
35 | // console.log(this);
36 |
37 | // const shop = {
38 | // purchase: () => {
39 | // console.log(this);
40 | // },
41 | // };
42 |
43 | // shop.purchase();
44 |
45 | // const myButton = document.querySelector('#myButton');
46 |
47 | // const shop = {
48 | // price: 100,
49 | // buy: function () {
50 | // myButton.addEventListener('click', () => {
51 | // // console.log(this);
52 | // console.log('I spent ' + this.price);
53 | // });
54 | // },
55 | // };
56 | // shop.buy();
57 |
58 | // Template literals AKA backticks
59 |
60 | // const firstName = 'Rakesh';
61 | // const lastName = 'K';
62 |
63 | // console.log(firstName + ' ' + lastName);
64 |
65 | // hello
66 | // how are you
67 |
68 | // const message = 'hello \n' + 'how are you';
69 | // const name = 'Rakesh';
70 | // const message = `hello ${5 + 6}
71 | // how are you
72 | // `;
73 | // console.log(message);
74 |
75 | // Enhanced object literals
76 | // computed propery keys
77 | // Method defination shorthand
78 | // Property shorthand
79 |
80 | // const accessToken = 'dsjfhkadhskfhk';
81 | // const refreshToken = 'adkjfljdlffdd';
82 |
83 | // const user = {
84 | // accessToken,
85 | // refreshToken,
86 | // };
87 |
88 | // console.log(user);
89 |
90 | // Destructuring
91 | // const user = {
92 | // name: 'John Doe',
93 | // age: 30,
94 | // };
95 |
96 | // const { name: fullName, age } = user;
97 |
98 | // console.log(fullName);
99 | // console.log(user.name);
100 |
101 | // const data = ['Rakesh', 30, 'Engineer'];
102 | // const [name, age, profession] = data;
103 | // const [count, setCount] = useState();
104 |
105 | // Default parameters
106 |
107 | // const register = (name, password, image = 'test.png') => {
108 | // // const img = image || 'test.png';
109 | // console.log(name, password, image);
110 | // };
111 |
112 | // register('Rakesh', 'secret', 'photo.png');
113 | // Spread ...
114 |
115 | // const languages = ['c', 'c++', 'javascript'];
116 | // const newLanguages = [...languages, 'typescript'];
117 |
118 | // const settings = {
119 | // volumn: 10,
120 | // brightness: 80,
121 | // };
122 |
123 | // const newSettings = { ...settings, volumn: 20 };
124 |
125 | // console.log(newSettings);
126 |
127 | // Rest ...
128 |
129 | // const addItems = (...items) => {
130 | // console.log(items);
131 | // };
132 |
133 | // addItems(3, 2, 4, 10, 30);
134 | // For of loop
135 | // Array, string, Object, set, map
136 |
137 | // const numbers = [2, 4, 5, 7];
138 |
139 | // for (const num of numbers) {
140 | // console.log(num);
141 | // }
142 |
143 | // const language = 'Javascript';
144 |
145 | // for (const char of language) {
146 | // console.log(char);
147 | // }
148 |
149 | // const person = {
150 | // name: 'Rakesh',
151 | // city: 'Moscow',
152 | // brand: 'apple',
153 | // };
154 |
155 | // for (const [key, value] of Object.entries(person)) {
156 | // console.log(key, value);
157 | // }
158 |
159 | // Promises
160 |
161 | // function login(cb) {
162 | // setTimeout(() => {
163 | // console.log('Login..');
164 | // cb();
165 | // }, 0);
166 | // }
167 |
168 | // login(() => {
169 | // // async
170 |
171 | // console.log('Redirecting');
172 | // });
173 |
174 | // function login() {
175 | // return new Promise((resolve, reject) => {
176 | // setTimeout(() => {
177 | // console.log('Login...');
178 | // reject();
179 | // }, 0);
180 | // });
181 | // }
182 |
183 | // login()
184 | // .then(() => {
185 | // console.log('Redirecting..');
186 | // })
187 | // .catch((err) => {
188 | // console.log('Error...');
189 | // });
190 | // find (Array methods)
191 |
192 | // const users = [{ name: 'Rakesh' }, { name: 'John' }];
193 |
194 | // const user = users.find((user) => {
195 | // return user.name === 'John';
196 | // });
197 |
198 | // console.log(user);
199 |
200 | // findIndex
201 | // const users = [{ name: 'Rakesh' }, { name: 'John' }];
202 |
203 | // const user = users.findIndex((user) => {
204 | // return user.name === 'Jane';
205 | // });
206 |
207 | // console.log(user);
208 |
209 | // Set
210 | // const uniqueNumbers = new Set();
211 | // uniqueNumbers.add(3);
212 | // uniqueNumbers.add(5);
213 | // uniqueNumbers.add(6);
214 | // uniqueNumbers.add(3);
215 | // console.log(uniqueNumbers.has(10));
216 |
217 | // const numbers = [4, 5, 6, 4, 7, 6];
218 | // const uniqueNumbers = new Set(numbers);
219 | // console.log(Array.from(uniqueNumbers));
220 |
221 | // map (Hashtables)
222 |
223 | // const urls = new Map();
224 | // urls.set('development', 'dev.example.com');
225 | // urls.set('production', 'prod.example.com');
226 |
227 | // console.log(urls.get('production'));
228 | // O(1)
229 |
230 | // const urlsObj = {
231 | // development: 'dev.example.com',
232 | // production: 'prod.example.com',
233 | // };
234 |
235 | // for (const [key, value] of urls) {
236 | // console.log(key, value);
237 | // }
238 |
239 | // console.log(urls.size);
240 |
241 | // order
242 | // size
243 |
244 | // classes
245 |
246 | // function Person(name) {
247 | // this.name = name;
248 | // }
249 |
250 | // const rakesh = new Person('Rakesh');
251 | // const john = new Person('John');
252 | // rakesh.name = 'Coders Gyan';
253 | // console.log(john);
254 |
255 | // class Person {
256 | // name;
257 |
258 | // constructor(name) {
259 | // this.name = name;
260 | // }
261 |
262 | // greet() {
263 | // console.log('Good morning');
264 | // }
265 | // }
266 |
267 | // class GreatPerson extends Person {
268 | // attitude = 'cool';
269 |
270 | // greet() {
271 | // console.log('Good Evening');
272 | // }
273 | // }
274 |
275 | // // const rakesh = new Person('Rakesh');
276 | // const john = new GreatPerson('Johny');
277 | // // john.name = 'Joy';
278 | // console.log(john.greet());
279 |
280 | // ESM ( ES6 modules )
281 | import { libName as myLibName } from './lib.js';
282 | import myLogin from './lib.js';
283 | myLogin();
284 | // console.log(myLibName);
285 |
--------------------------------------------------------------------------------