全栈之js入门篇

1.html与js关系

Html:写网页结构

Css:控制网页样式

Javascript:  控制网页行为

2.js书写位置

    (1).内嵌式

    (2).外联式

(3).行内式(外双内单:（外部的用双引号，内部的用单引号）)

3.js初体验(页面弹出消息)

注意：

    Console.log()        在控制台输出日志 （  控制台.日志()  ）                  

Console.warn()在控制台输出警告  (  控制台.警告()  )

Console.error()在控制台输入错误  (  控制台.错误()  )

无论哪种方法，程序末尾，一定要加英文状态下的分号(;)。

4.js语法注释

4.js变量

(1).变量命名

  1.变量命名必须以字母或是下标符号”_”或者”$”为开头。

2.变量名长度不能超过255个字符。

3.变量名中不允许使用空格，首个字不能为数字。

4.不用使用脚本语言中保留的关键字及保留符号作为变量名。（var.top）

5.变量名区分大小写。(javascript是区分大小写的语言)

6.汉字是可以作为变量名的。（没人这么做，显的不专业）

(2).变量和作用域

  1.全局变量（成员变量）

在方法外部声明的变量

方法内部，没有加var关键字声明的变量

2.局部变量

方法内部，使用var声明的变量

总结：凡是不适用var定义的变量，无论在哪儿定义的都是全局变量。

 

    (3).隐式全局变量

不容易被发现的全局变量。（下面这个案例中的bcd）

var a=1,b=2,c=3;这行代码的意思是，abc公用一个var.

var a=1;b=1;c=1;   这行代码的意思是，var只给a。 

                       （；就是一行代码的结束。）

5.js函数

    函数就是可以重复执行的代码块。

    (1).结构

       1.用关键字function来定义。

       2.function之后又第一个空格。

        3.然后是函数名+（）+{}

           （可以有名字，也可以没有名字）（匿名函数）

        4.大括号里面是预先想要重复执行的代码。

    注意：

       函数不调用不执行

           调用方法：  函数名（）;

函数的加载。（不调用的情况下，只加载函数名，不加载函数体）

       函数是可以传参数的

           函数在执行的过程中，我们可以往函数中传递参数。

 

6.js事件

    事件源: 每一个标签都可能是事件源。（标签就是事件源！）

    事件:

    事件驱动程序: 事件被触动后，我们希望他执行什么程序，就写到函数中

 

    事件驱动程序执行流程：

       事件源.事件  =  function(){事件驱动程序      }

       标签.js = function(){执行命令}

7.js数据类型

1）.简单数据类型

    String        Number      Boolean        null       undefined

字符串   数字            布尔           空  未定义

“”   0123        true/false       自己       还没有定义

    2）.复杂数据类型

       对象（Object），函数(function)，数组（array），日期(Date)，正则...........

    3）.数据类型转换

       a.String类型转换

           1. 变量+ ''''

2. String(变量)

3. a++a= a+1  不是一样的：a是String类型的时候后面的结果是a1;

       b. Number类型

           1、进制问题。

var result = 0xb;  //表示十六进制

var result1 = 020;//表示八进制

           2、丢失精度。

0.1+0.2 = 0.30000000000000004

           3、数据类型转换

1. x-1x*1  x/1      变成Number类型（只有String类型）

2. Number(变量)

如果变量中包含字母，返回一个NaN.

       c. Boolean类型

           使用

              false、undefined 、null、0、“” 都表示为 false

              true、1、“somestring”、[Object] 都表示为 true

              任何数据类型，都可以转换成布尔类型

       d.null和undefined（任何数字和undefined相加(运算)都是NaN）

           null和undefined有最大的相似性。看看null == undefined的结果(true)也就更加能说明这点。不过相似归相似，还是有区别的，就是和数字运算时，10 + null结果为：10；10 + undefined结果为：NaN。

 

8.内置方法

    1）. parseInt（）；取整

取整  parseInt(只能放一个值);首个字符必须为数字。Or:NaN.

parseInt(变量，进制) ：这个方法能够让一个指定进制的数变为十进制

       指定进制的值 = number(十进制).toString(指定的进制);

通过这两个方法我们可以完成，任意进制的转换

    2）. parseFloat（）; 取小数

       只有一个用法就是：取值（取小数）

 

9.额外补充

    1）隐藏盒子

       1.   display： none;             隐藏盒子（不占位置）

2.visibility：hidden;           隐藏盒子（占位置）

3.   overflow: hidden;            隐藏超出盒子的部分。

    2）显示盒子

       1.  display： block;             显示盒子

2.visibility：visible；显示盒子

    3）js加载问题

       1.js的加载时和html同步。（顺序加载，加载到谁，就执行谁。）

2.Css和html是不同步加载的。（先加载HTML，后加载css。）

 

 

null