javascript初学基础

73 阅读5分钟

JavaScript简称js,是一个运行在客户端浏览器的弱类型解释型面向对象的脚本语言

所谓解释型就是在代码执行前不会去检查语法错误可以直接运行,但是运行期间出现错误就会终止程序。 弱类型指在创建变量时不需要刻意去注意数据类型,我们可以随意创建不同类型的数据。

JavaScript的2种引入方式

1.直接在body标签里面写script标签在标签里面写我们的JavaScript代码

2.在外部创建一个xx.js的文件还是在body标签里面写一个script标签通过它的scr属性引入我们的外部js文件,使用这种方式后script标签里面不能再写JavaScript代码,如:

<body>
<script scr="xx.js">

</script>
</body>

JavaScript三种输出打印方式

1.console.log() 在控制台打印输出

2.document.write() 在页面上打印输出但是会覆盖原本的页面样式

3.alert() 在警示框中打印输出

变量与常量

var 变量 = 值 变量是可以被修改的

var 变量1 = 值,变量2 = 值;(创建多个变量简写)

const 常量 =值 常量被定义后是不允许修改的

算术运算符:+ - * / %(具有隐式转化)

+运算:如果左右两边出现了一个字符串,+运算会变成字符串的拼接操作

-*/%:字符串也可以变为数字,但是前提:必须是纯数字组成的字符串才可以否则就为NaN

NaN参与任何算术运算,结果仍为NaN; 参与任何比较运算,结果都是false

比较运算符:> < >= <= == != === !==(除开===和!==其他的具有隐式转化)

比较运算返回的都是Boolean(布尔值)

逻辑运算符 && || !

&&(与):指两个全部条件都满足才为真

||(或):指有一个条件为真即整个条件就为真

!(非):就是取反的意思

赋值运算 = += -= *= /= %=

+=的意思为a=a+(+=右边的东西)(其他的同理)

自增和自减 i++ ++i i-- --i

前++和后++的区别在于与其它表达式使用时前++返回的是加1之前的值 后++是加1之后的值

单独使用时两者没有区别

位运算 << >>

a<<b 等同于a*2的b次方 a>>b 等同于a/2的b次方

程序运行结构:

1、顺序结构 - 默认,从上向下的依次执行

2、分支结构 - 通过条件的判断,选择部分代码执行

if...else...

一个条件,一件事,满足就做,不满足就不做

		if(条件){
			操作
		}

一个条件,两件事,满足就做第一件,不满足就做第二件

		if(条件){
			操作
		}else{
			默认操作
		}

多个条件,多件事,满足谁就做谁

		if(条件1){
			操作1
		}else if(条件2){
			操作2
		}else{
			默认操作
		}

switch...case..

switch...case..是做等值比较的(不带隐式转化)如果条件值为值1就做值1里面的操作,注意要在操作后面加上break,不然程序在做完值1操作后还会一直执行到底

switch(条件也可以是表达式){
        case1:
            操作1
            breakcase2:
            操作2;
            breakdefault:
            默认操作;
}

三目运算

短路: 条件&&(操作)----if

三目:条件?操作1:默认操作 ---if..else..

条件?操作1:条件2?:操作2:默认操作 ---- if..else if...else..

3、循环结构 - 通过条件的判断,选择要不要重复执行某些代码

循环结构:

while循环:
    语法:
    var 循环变量=几;
    while(循环条件){
        循环体;
        循环变量变化;
    }

while死循环: 不确定循环次数的时候使用

        while(true){
            循环体;
            退出循环语句:break 
        }

for循环:

    for(var 循环变量=几;循环条件;变量的变化){
            循环体;
               }

for死循环:

    for(;;){
            循环体;
        }

while 和 for 的区别?

不确定循环次数的时候,会使用while循环 - 死循环

能确定循环次数的时候,就用for循环,而且显得代码更漂亮更简洁

数据类型:

分两大类

1、原始/基本/值类型:5个

Number - 数字,取值:无数个

String - 字符串,取值:无数个,必须写上'' 或 ""

Boolean - 布尔,取值:两个:true/false - 往往用于判断比较的条件处使用

Undefined - 取值:1个:undefined,创建了一个变量,但是没有赋值,默认值为undefined;

Null - 空,取值:1个:null,释放变量/内存,节约内存空间

2、引用/对象类型:11个引用类型的对象

数据类型转化:不同的数据类型做操作可能出来的结果是不一样的

JavaScript获取页面上的一切东西,数据类型默认都是一个字符串

1、转字符串:

var str=x.toString();

String(X);不如+""

2、转数字:

1、parseInt(str/num);
执行原理:专门为字符串和小数转为整数数字准备的,从左向右依次读取每个字符,碰到非数字字符,就停止转换

2、parseFloat(str);
执行原理:几乎和parseInt一致,认识第一个小数点

3、Number(x);不如-0因为它是隐式转换的底层

Function:函数,称之为方法:需要提前预定义好的,以后就可以反复使用的代码段

如何使用:2步

1、定义/声明/创建函数:

        function 函数名(){
            若干的代码
        }

2、调用/使用函数:

    1、要么在js中程序员直接写死,要执行几次:函数名();
    
    2、交给用户绑定在某个元素上,写上点击事件,让用户来触发:
        <elem οnclick="函数名()">内容</elem>

何时使用:

1、不希望打开页面立刻执行,而需要时再使用 或 由用户来触发

2、希望能够反复执行,不用刷新页面

3、函数内的一切内存,函数调用完毕后都会自动释放

4、有重复的代码段可以封装成函数调用

带参数的函数:

创建:

function 函数名(形参1,形参2,...){
            函数体;
        }

使用:实参:实际参数,真正的值,需要在你调用时再传入

        函数名(实参1,实参2,...)

特殊: 1、传实参的顺序一定要和形参的顺序一一对应,并且数量也要对应

2、不是一定要带参数的函数才是好函数,具体情况,需要具体分析:

如果你的函数体就是固定的 - 则普通函数

如果你的函数体希望根据传入的实参不同,做的略微不同 - 则带有参数的函数