30DaysOfJavaScript-First Day

在github上有一个30天学会Javascript的项目，本文对其进行了一些翻译与缩写，侵权删

使用快捷方式打开控制台

Mac 
Command + Option + I 

Windows：
Crtl + Shift + I

第一个JavaScript代码

我们使用了内置函数console.log（）。我们传递了一个参数作为输入数据，该函数显示了输出。我们在console.log（）函数中传递了“ Hello，World”作为输入数据或参数。

console.log('Hello, World!')

console.log（param1，param2，param3）可以接受多个参数。

console.log('Welcome', 'to', 30, 'Days', 'Of', 'JavaScript')

注释

示例：单行注释

//这是第一条注释

示例：多行注释

/ *这是一个多行注释
多行注释可以占用多行
* /

算术运算

console.log(2 + 3)   // 加 console.log(3 - 2) // 减 console.log(2 * 3) // 乘 console.log(3 / 2) // 除 console.log(3 % 2) // 求余 console.log(3 ** 2) // 次方

环境

我们使用Visual Studio Code[win10自带软件]进行较大项目的开发

将JavaScript加入网页

行内脚本(Inline script)

在桌面上创建一个文件夹，然后在项目文件夹中创建一个index.html文件。然后粘贴以下代码，然后在浏览器中将其打开。

<!DOCTYPE html>
  <html>
    <head>
      <title>30DaysOfScript:Inline Script</title>
    </head>
    <body> <button onclick="alert('Welcome to 30DaysOfJavaScript!')">Click Me</button> </body> </html>

内嵌脚本(internal script)

内部脚本可以写在头部或正文中，但是最好将其放在HTML文档的正文中。首先，让我们写在页面的开头。

<!DOCTYPE html>
  <html>
    <head>
      <title>30DaysOfScript:Internal Script</title>
    </head>
    <body> <button onclick="alert('Welcome to 30DaysOfJavaScript!');">Click Me</button> <script>  console.log("Welcome to 30DaysOfJavaScript"); </script> </body> </html>

外联脚本

与内部脚本类似，外部脚本链接可以位于标头或正文中，但最好将其放在正文中。我们应创建一个js文件，我们第一个js文件命名为introduction.js

console.log('Welcome to 30DaysOfJavaScript')

在头部外联

<!DOCTYPE html>
  <html>
    <head>
      <title>30DaysOfJavaScript:External script</title>
      <script src="introduction.js"></script> </head> <body> </body> </html>

多外联脚本

指有多个外联脚本组成，我们再新建helloworld.js文件

console.log('Hello, World!')

<!DOCTYPE html>
  <html>
    <head>
      <title>Multiple External Scripts</title>
    </head>
    <body> <script src ="./helloworld.js"></script> <script src="./introduction.js"></script> </body> </html>

数据类型

number

整数：形如-3，-2，-1，0，1，2，3....

浮点数：形如-3.5，1.2，1.0，2.5.....

String

一堆在' '," ",` `中间的字符

'Asabeneh'
'Finland' 'JavaScript is a beautiful programming language' "I love teaching" 'I hope you are enjoying the first day' `We can also create a string using a backtick`

Booleans

只返回true或者false

Undefined

未赋值的变量或未有任何返回值的函数返回undefined

let firstName;
console.log(firstName); //not defined, because it is not assigned to a value yet

Null

表示空值(empty value)

let emptyValue = null

检查数据类型

我们使用typeof操作符来检查一个确定数据的类型

console.log(typeof 'Asabeneh') // string console.log(typeof 5) // number console.log(typeof true ) // boolean console.log(typeof null) // object type console.log(typeof undefined) // undefined

变量

变量是数据的容器，用于将数据存储在内存位置的变量。声明变量后，将保留一个存储位置。将变量分配给值（数据）后，存储空间将被该数据填充。要声明变量，我们使用var，let或const关键字。

对于会更改的变量，我们使用let。如果数据完全不变，则使用const。

JavaScript变量名称不应以数字开头；不允许除＄和_外的其他特殊符号；遵守camelCase约定；单词之间无空格。一些允许的变量名：

firstName
first_Name
$num_1
_num_1

无效变量名：

first-Name
1_Name
_num_#1

定义实例：(多行定义）

// Declaring different variables of different data types
let firstName = 'Asabeneh' // first name of a person let lastName = 'Yetayeh' // last name of a person let country = 'Finland' // country let city = 'Helsinki' // capital city let age = 100 // age in years let isMarried = true console.log(firstName, lastName, country, city, age, isMarried)

（单行定义）

// Variables can also be declaring in one line separated by comma
let name = 'Asabeneh', // name of a person job = 'teacher', live = 'Finland'; console.log(name, job, live);

作业

Write a single line comment which says, comments can make code readable
Write another single comment which says, welcome to 30DaysOfJavaScript
Write a multiline comment which says, comments can make code readable, easy to use and informative
Create a variable.js file and declare variables and assign string, boolean, undefined and null data types
Create datatypes.js file and use the JavaScript typeof operator to check different data types. Check the data type of each variable
Declare four variables without assigning values
Declare four variables with assigning values
Declare variables to store your first name, last name, marital status, country and age in multiple lines
Declare variables to store your first name, last name, marital status, country and age in a single line
Declare two variables myAge and yourAge and assign them initial values and log to the browser console.