1、strict mode

strict mode
激活后,让我们写出更安全的代码
必须写在第一行

  1. 'use strict';

image.png
image.png

2、functions 函数

what actually are functions?

is simply **a piece of code that we can reuse over and over again **in our code. so it’s a little bit l**ike a variable ** but for whole chunks of code. so remember **a variable holds value but a function can hold one or more complete lines of code**.


2.1 function decrations and expressions 函数声明和语句表达

image.png
the process of using the function is called
invoking the function 调用函数
running the function 运行函数
calling the funcion 调用函数

think of functions as machines 把函数想象成机器
let’s imagine a food processor
image.png
functions allow us to write more maintanable code
让我们可以编写更易于维护的代码
because with funtions, we can create reusable chunks of code
因为通过使用函数,可以创建可复用的代码块,
instead of having to manually write the same code over and over again
代替一遍一遍的重复手动编写现同的代码

principle
don’t repeat yourself or dry
so we say that we should keep our code dry which means tha we should not repeat ourselves

2.2 Arrow Function

  1. //function expression
  2. const calcAge2 = function (birthYear) {
  3. return 2037 - birthYear;
  4. }

更短的函数表达式
简单形式

  1. //Arrow function
  2. const calcAge3 = birthYear => 2037 - birthYear;
  3. const age3 = calcAge3(1991);
  4. console.log(age3);

复杂形式
多行的时候需要写上return语句

  1. const yearUntilRetirement = birthYear => {
  2. const age = 2037 - birthYear;
  3. const retirement = 65 - age;
  4. return retirement;
  5. }
  6. console.log(yearUntilRetirement(1991));
  1. const yearUntilRetirement = (birthYear, firstName) => {
  2. const age = 2037 - birthYear;
  3. const retirement = 65 - age;
  4. return `${firstName} retires in ${retirement)years.`;
  5. }
  6. console.log(yearUntilRetirement(1991, 'Jonas'));

2.3 Functions calling other functions

image.png

2.4 review

3种不同的函数类型
image.png

调用函数不带括号,那么只是一个值;
带括号,实际是是调用了这个函数
image.png
anatomy of a function
image.png

3、Arrays 数组【数据结构】

3.1 Introduction to Arrays

创建数组

  1. const friends = ['Michael', 'Steven', 'Peter'];
  2. console.log(friends);
  3. const years = new Array(1991, 1992, 2004, 2010);
  4. console.log(years);

image.png

访问数组
image.png

array可以存放不同类型的数据

  1. const firsName = 'Jonas';
  2. const jonas = [firsName, 'Schedtman', 2037 - 1991, 'teacher', friends];
  3. console.log(jonas);

image.png

3.2 Basic Array operations(Methods) 常见的数组操作/方法

  1. const friends = ['Michael', 'Steven', 'Peter'];
  2. //add elements
  3. //add to the end 有一个返回值 表示数组长度
  4. const newLength = friends.push('Jay');
  5. console.log(friends);
  6. console.log(newLength);
  7. //add to the first
  8. friends.unshift('John');
  9. console.log(friends);
  10. //remove elements
  11. //移除最后一个,返回移除的值
  12. const removedElement = friends.pop();
  13. console.log(friends)
  14. console.log(removedElement);
  15. //移除第一个
  16. friends.shift();
  17. console.log(friends);
  18. //在数组中的位置
  19. console.log(friends.indexOf('Steven'));
  20. console.log(friends.indexOf('Bob'));
  21. //元素是否存在数组,返回true, false
  22. console.log(friends.includes('Steven'));
  23. console.log(friends.includes('Bob'));
  24. if (friends.includes('Steven')) {
  25. console.log('You have a friend called Steven');
  26. }

image.png
include 最常用的用法
比如登陆时候,查询是否有该用户名

4、Object 对象【数据结构】