初识JavaScript 、JS基础 、JS书写的的位置、 JS注释 、JS输出语句 、JS 变量 var 、JS用户输入 prompt、 JS数据类型、 JS数据类型检测、 JS类型转换

1.初识JavaScript

一个网页的组成

• HTML 网页的结构。
• CSS 网页的表现。
• JavaScript 网页的行为，
  用户与网页的交互，
  网页的特效。

ECMA

• ECMAScript：js语言的标准。
• JavaScript：实现。

JavaScript组成

• ECMAScript：js语言的语法。包含如何定义对象，定义变量，书写表达式等等。
• BOM：操作浏览器部分功能。 比如：操作滚动条，操作历史记录。
• DOM：操作网页上的元素。让元素移动，改变class属性值。图片的轮播。

版本

ES5、ES6 = ES2015、ES2016、ES2017

2.书写的的位置

行内式（强烈不推荐！）

• 需要配合行为，比如说点击事件。
• a标签是一个特殊的标签，因为它本身就有点击效果。一般它的点击事件我们会书写在href属性中。

内嵌式（不推荐 做小练习时适用）

通过script双标签书写。

• 书写的位置可以随意，但是推荐head的末尾或者body的末尾。现在先放在body的末尾。
• 一个页面可以书写多个script标签，会按照从上往下的顺序依次执行。
• 不需要行为，打开页面会自动执行script标签中的内容。

外联式（强烈推荐）

• 通过script标签的src属性引入一个外部的js文件。

【注意】

• 外联式与内嵌式不要同时作用在一个script标签上，如果同时作用，script标签中的内容会被忽略。

3.注释

注释：

• 对代码的解释说明。
• 对用户来说，一般是不可见的。主要是开发人员去读写的。

单行注释 //

• 快捷键：ctrl+/

多行注释 /* */

     /*
        代码内容
        代码内容
   */

• 快捷键：shift + alt + a(默认)
• 更改快捷键：左下角的齿轮==>键盘快捷方式==>输入注释 ==> 点击块注释前面的笔标记 进行修改即可。

4.输出语句

js的输出语句

alert：在浏览器中弹出一个消息框。

• alert弹出时，会阻止它下面的代码的执行。
• alert必须点击后，才会消失，才会执行下面的代码

console.log（要输出的内容） 在控制台输出。

document.write(要输出的内容) 在页面中输出 。

• 内容中如果有标签，则会将其解析。

例：

    alert('这是一个警示框，将会在浏览器中弹出');

	console.log('这里面的内容，将会输出在控制台');

 	document.write('这里面的内容，将会输出在在浏览器');

5.变量 var

变量：存放数据的容器。

    优点：

• 一次定义，多次使用
• 方便维护。

    定义：

• 关键字：var variate的缩写。
• 格式： var 变量名。
• 中间一定要有空格。变量定义完成后，只是完成了容器的定义，里面没有任何的值。如果此时使用，会提示undefined。
      例：Uncaught ReferenceError: a is not defined 。 a变量不存在。

    赋值：

• 使用赋值运算符 = 。
• 将等号右边的值，赋值给左边的变量。
• 也可以将定义和赋值书写在一起。
      例：var a; a = 10;就可以简写为 var a = 10；

【注意】

• 如果等号右边是一个变量，则表示将变量中存放的值赋值给左边的变量。
• 如果一个变量赋值了多次，则以最后一次赋值的结果为最终结果。
• 如果没有var关键字，也不会报错，但是强烈不推荐这么写！！！
• 声明多个变量时，可以简写。一个var后面可以跟多个变量名，变量名之间用逗号隔开。声明变量时，也可以直接赋值。

变量的声明提升：

• js会将程序中要用到的变量，变量的声明，执行顺序提升到最前面。

例：

      console.log(a);
      var a = 10;
      真正的执行顺序为下面的代码：
      var a;
      console.log(a); // undefined
      a = 10;
      console.log(a); // 10

命名规则与规范:

     规则：强制性，必须遵守

• 变量只能由数字，字母，下划线，美元符（$）组成。
• 不能以数字开头。
• 不能使用关键字或保留字。
• 关键字：js中有特定功能的字符。
• 保留字：js中现在还没有特定功能的字符，但是以后可能有。

     规范：约定俗成，建议遵守。

• 不要用中文命名。
• 不要用拼音。
• 见名知意。
• 驼峰命名法：当一个变量是由多个单词组成时，从第二个单词开始，首字母大写。
  【注意】： js命名会严格区分大小写！！！ age,Age,aGe,agE 是不同的变量。

6.用户输入 prompt

用户输入：

• prompt(title，[default]) 弹出一个能够让用户输入的对话框。一般来说会用一个变量去接收用户输入的内容。

• title:显示给用户的文本。
• default:可选参数，input框的初始值。
• confirm() 弹出一个确认框。点击确定返回的是true，点击取消返回的false。

【注意】：

• 语句以分号结尾，一个分号就表示一个语句结束。
• 一般情况下，换行也会默认语句结束。
• 一个语句推荐独占一行，提高代码的可读性。

例：

	var demo = prompt('这是一个输入框');
    console.log(demo);

7.数据类型

js中数据的类型分为两类八种：

基础数据类型：

number

undefined

null

布尔值

字符串

复杂数据类型：

对象 object：

数组 array：

函数 function：

1.number:

1.整数和浮点数（小数）

• 浮点数不是一个精确的值，所以涉及小数的运算要各位注意。
• 如果需要浮点数的运算，先将浮点数转为整数，进行运算。运算完成后，再讲结果转为浮点数。

2.其他进制的数字：

• 八进制：前缀 0o或者0O，0 范围 0~7
• 十六进制：前缀：0x或者0X 范围 0~9a-f
• 二进制：前缀0b或者0B 范围 0 ~1

3.科学计数法：有些情况下，数字会自动转科学计数法

• 小数点后面的0超过5位
• 小数点前面的数字超过21位

4.特殊数值：

• NaN：Not a Number (非数字) 主要出现在将字符串转换为数字时出错的场景。
• infinity:无限大。 出现在除法中，分母为0的时候。

【注意】：number是有范围的。

2、3.undefined和null：

• undefined：未定义

• 我声明了一个变量,需要给它赋值,但是没有赋值,这个就是就是undefined.

• null： 没有、空

• 我声明了一个变量,也给它赋值了,赋的就是null.

4.布尔值(boolean)：

• 布尔值就是true（正确）和false（错误）
  一般用来做判断的结果。

5.字符串(string)：

• 是0个或多个串在一起的字符，放在单引号或者双引号之中。
• 想要在字符串中使用引号，如果使用双引号，最外层应该用单引号，里面使用单引号，外面使用双引号。
• \在字符串中表示转义，会将后面紧跟的字符尝试转义，如果转义不成功，则这个\会自动忽略。

• \n 换行
• \“ 双引号
• ’ 单引号
• \\ 反斜杠

• 字符串可以用 + 拼接

例：

    var name = "张三";
    var age = 20;
    console.log('我的名字是' + name + ',我今年' + age + '岁了。');  //我的名字是张三,我今年20岁了。

var demo = "";//也是一个字符串，不过是一个空字符串。

8.数据类型检测

• 因为js是一个弱语言，变量可以放任何的数据类型。
• 我们用变量进行运算时，为了保证程序的正确性，有时候需要进行类型检测。
• 关键字：typeof

• 返回一个值的数据类型。只能精确的返回简单数据类型。
• 返回值是一个字符串。
• 如果我们要对表达式的结果进行判断，需要用括号包裹起来。

例：

    // var a = 10;
    // a = "10";
    // a = true;
    // var b = true;
    // var c = "3";
    // var d = b + c;
    // alert(d-1);
    // alert(typeof 123);  //number
    // alert(typeof "123"); //string
    // alert(typeof true);//boolean
    // alert(typeof null);//object 历史原因，最开始的js只有五种类型：null被划分到了object中。
    // alert(typeof undefined)//undefined
    var n1 = 100;
    var n2 = 200;
    alert(typeof(n1 + n2));  //number

9.类型转换

类型转换：将其他的数据类型转为我们想要的数据类型。

• 强制类型转换：

• 转数字
• 转字符串：
• 转布尔值：

• 自动类型转换

• Number（要转换的值） ：将任意类型的值转为数字。
• 【注意】

• 符串转换：如果可以转换，转换的结果是数字，不可以转换，结果是NaN。
• 布尔值： true→1 false→0。
• null →0。
• undefined→NaN。
• " " → 0。
• 【总结】 能转数字，结果是数字，不能转结果为NaN。

    alert(Number("123.456"));  //123.456
    alert(typeof Number("123abc"));  //number
    alert(typeof "123"); //string
    alert(Number(""));  //0
    alert(Number(undefined));  //NaN

• parseInt（要转换的数据）：将字符串转为整数。

• 一个一个字符转换的，如果碰到不能转数字的字符，就不会进行下去了，直接返回已经转好的部分。
• 不认识小数点。
• 如果第一个字符就不能转数字，返回NaN。
• 如果字符以0x开头，会将其按照十六进制解析。
• parseInt的结果要么是一个十进制的数，要么就是NaN。

• parseFloat(要转换的数据)：将字符串转为浮点数。

• 一个一个字符转换的，如果碰到不能转数字的字符，就不会进行下去了，直接返回已经转好的部分。
• 如果第一个字符就不能转数字，返回NaN。
• 如果字符以0x开头，会将其按照十六进制解析。
• parseInt的结果要么是一个十进制的数，要么就是NaN。

    alert(parseInt("123.456"));  //123
    alert(parseInt("123ab456"));  //123
    alert(parseInt("a123"));  //NaN  
    alert(parseInt(null));  //NaN
    alert(parseFloat("123.4a56"));  //123.4
    alert(Number("123.4a56"));  //NaN

• 强制转字符串

• String(要转换的数据)：将任意类型的值转为字符串。

• number
• boolean true false
• null
• undefined
• 【总结】 全加双引号。

    alert(typeof String(123));  //string
    alert(String(true));  //true

• 强制转布尔值：Boolean(要转换的值)

• 将任意类型的值转为布尔值。
• 除了以下五个值的结果为false，其他全都转为true。

• undefined
• null
• 0 (非0即真)。
• NaN
• " " (空字符串)

    alert(Boolean(-0));  //false
    alert(Boolean(NaN));  //false

• 自动转字符串

• 【结论】任何类型的数据与字符串做相加（+）操作时，都会自动转为字符串类型，此时的+不是算术运算符，而是拼接。

    var myName = '张三';
    var age = 18;
    alert(myName + '今年已经' + age + '岁了。');  //张三今年已经18岁了。

• 自动转数字

• 【结论】除了与字符串做相加操作，任意的数据类型做算术运算时（+ - * / % **），都会转为数字。
• NaN与任何数字做运算都是NaN。

    var a = 10;
    var b = 20;
    console.log(a+b);  //30
    var a = 10;
    console.log(a+NaN); //NaN

---

Day 1