js基础语法总结

一、简介

1、组成
核心（ECMAScript）：语言核心部分。
文档对象模型（Document Object Model，DOM）：网页文档操作标准。
浏览器对象模型（BOM）：客户端和浏览器窗口操作基础。

二、编程语言的组成部分：变量、数据类型、运算符、流程控制、函数、面向对象：c语言 / 面向对象：c#、js、java、py、php。

1、变量

例：var name="jack";

规则：变量由数据、字符串、下划线、美元符组成，不能以数据开头，不能包括标点符号特殊符号、关键字、空格，区分大小写。
2、数据类型
在js里所谓的数据类型，就是解析对输入数据的判断。
数据类型的分类：
**⑴基本数据类型：**字符串 string、数字 number、布尔 Boolean、null、undefined：没有返回值，Symbol是ES6 引入了一种新的原始数据类型，表示独一无二的值。
**(2)复杂数据类型：**对象 object、数组 array 对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：

var person={firstname:"John", lastname:"Doe", id:5566};

js的注释
（1）、单行注释：// （2）、多行注释：/* / (3)、/*
*
*/
类型的转换
（1）、隐式转换（自动类型转换）：系统自动转换。
在if判断语句里，空字符、0、0.0、false、null、undefined为false。

var age="23"; var name ="jack"; var str=age+name;
console.log(str);//输出23Jake

**（2）、显示转换（手动转换）：**人为的调用函数去转换。 数据<—>字符串
转为数字：
parseInt();把其他的数据类型转化为int类型。
number();转为数字。

var name="jack";
var res=parseInt("name");
console.log(res);//NaN not a number 不是一个数字

parseFloat();转为浮点型。
tostring();转为字符串。

3、运算符
（1）、算术运算符

+ -  * / % ++ --

自增：++

var age =10;
var num=10+ ++age; //加加 20
console.log(num);//21

如果加加在前和加加在后不参与表达式运算，作为一个单独语句的时候是没有区别的，都是加1参与表达式运算时：
加加在前，会先执行自增运算，然后在参与表达式运算。
加加在后，会先参与表达式的运算，然后在进行自增运算。
（2）、赋值运算符
= += -= /= %=

var age=23;
age=age+2; 等价于 age+=2;

(3)、比较运算符
==；等于 =；全等于 ！ > < >= <=

var num1="1234";
var unm2=1234;
unm1==num2; // == 比较的是指；===全等于；比较的是值和类型。

（4）、逻辑运算符：运用在流程控制里面
&& || ！

var a =1;
var b=2;
var c=3;
var age=3;
var res=age>3? "上学":"不能上学";
console.log(res);
var res= a>b?a>c?a:c:b>c?b:c;
console.log(res);

4、流程控制
程序的三大基本结构：分支结构、顺序结构、循环结构
（1）、if语句

if（判断/条件表达式true/false)
{
//执行语句
}else{
//条件不成立时执行的语句
}

//判断年龄断所在的区间
var age=80; 
 if(age<18){
    console.log("未成年");
}
else if(age>=18&&age<30){
    console.log("青少年")
}
else if(30<=age&&age<45){
    console.log("中年")
}
else if(age>=45){
    console.log("老年");
}

//根据用户输入的成绩判断级别

var score =parseInt(prompt("请输入你的成绩:"));
//console.log(typeof score);
 if(!isNaN(score)){
    if(score >=90){
        console.log("你的成绩A")
    }
    else if(score>80){
        console.log("你的成绩B")
    }   
//……
    else{
     console.log("不及格");
    }
    }
else{
    console.log("输入有误");
}

//根据输入判断平闰年
闰年：能被4整除但不能被100整除，或能被400整除的年份。

year %4==0 && year%100 !=0 || year%400==0;

(2)、switch语句：使用在有精确值的场景，switch能实现的if else if都能实现

var score =parseInt(prompt("请输入成绩"))
switch(score){
case 100: //只能输入具体的值
console.log("满分");
break; //跳出整个循环
default://默认值
console.log("输入有误，请重新输入");
}

(3)、for循环（需要确定循环次数）
for(初始化表达式;判断表达式;自增表达式){
//循环体
}
注：只写判断表达式的话就是死循环，但分号必须写
例：打印1-100之间的所有数

for(var i=1;i<=100;i++){
console.log(i);
}

例：循环嵌套，打印正方形（外层控制行，内侧控制列）

var str="";
for(var i=1;i<=6;i++){
    for(var j=1;j<=6;j++){
        str+="*";}
    str+="\n";    
}
console.log(str);

例如：打印倒三角形，如果打印正三角的话第二层循环改为(var j=1;j<=i;j++)

var str="";
for(var i=1;i<=6;i++){
    for(var j=i;j<=6;j++){
        str+="*";
    }
    str+="\n";
}
console.log(str);

continue:跳出当前循环、使用在if语句
breack：跳出整个循环、switch语句、if语句
continue：
求1-100中不能被7整除的数的和；

var sum=0;
    for(vr i=1;i<=100;i++){
        if(i%7==0){
            continue;
        }
        sum+=i;
    }
    console.log(sum);

breack:求200-300中第一个能被7整除的数

for (var i=200;i<=300;i++){
    if(i%7==0){
        console.log(i);
        break;
    }
}

(4)、while和do while：不知道循环次数时使用
注：能用for做的while就能做

while (循环条件){
    //循环体
}

应用场景：只要循环条件不成立，则循环体一直执行

//do while
do{
    //循环体 
}
while();//循环条件

例题：

//1.while
//验证账号密码输入是否正确
var username=prompt("请输入你的账号");
var userpwd=prompt("请输入你的密码");
while (username!="admin"&&userpwd!="123456")
{
    username=prompt("请输入你的账号");
    userpwd=prompt("请输入你的密码");
}
alert("登录成功");

2、do while

var i=1;
var sum=0;
do {//循环体
    sum+=i;
    i++;
}
while(i<=100);//循环条件
console.log(sum);
//注意：不管条件是否成立都先执行一次循环体。

5、函数
1、提高代码的重用性；
2、提升代码的可维护性；

function printStar(num){
    var str="";
    for(var i=1;i<=num;i++){
        for(var j=1;j<=i;j++){
            str+="*";
        }
        str+="\n";
    }
    console.log(str);
}
printStar(8);
printStar(9);

①函数的定义/语法
a、声明的方式来定义函数，常用
fuction funcname(参数1,参数 2,参数3……){
//函数体，干具体事情的
}

例：

function add(arg1,arg2){
    var res=arg1+arg2;
    return res;//返回值
}
res =add(3,3);
console.log(res);

b、函数的表达式定义函数，常用

var add=function(arg1,arg2){
    var res=arg1+arg2;
    return res;
};
// console.log(add);
var r=add(3,3);
console.log(r);

c、构造函数的方式来定义一个函数、不常用

var add=new Function("arg1",'arg2','return arg1+arg2');//函数体
var res =add(1,2);
console.log(res);

d、Es6里，箭头函数

var add =(arg1,arg2)=>{
    return arg1+arg2;
};
var res=add(1,1);
console.log(res);

②、函数的参数

function foo(a,b=true){
    console.log(a);
    console.log(b);
}
foo(1);
//注意：如果b没传值，则给默认值：undefined。
//传和不传值

//传一组数据过来，个数不确定，把最大的值找出来

//argumens参数不确定时使用
function findMax(){
    var max=arguments[0];//假设arguments[0]的值为最大值
    if(arguments.length<2){
        return;
    }
    for(var i=1,len=arguments.length;i<len;i++){
        if(arguments[i]>max){
            max=arguments[i];
        }
    }
    return max;
}
var res=findMax(1,5,2,8,4);
console.log(res);

③函数的调用（call）
1、作为一个函数调用

function foo(){
    
}
foo();

2、作为对象方法的调用

var obj={
    name:"jack",
    age:23,
    run:function(){
        console.log("ren……");
    }
};
obj.run();

3、作为一个构造方法调用

function Foo (){
    this.name="jack";
    this.age=23;
    this.run=function(){
        console.log("run……");
    }
}
var f =new Foo();
console.log(f.run());

4、作为一个参数传递另一个函数，然后再函数里面调用

var arr=[1,2,5];
function cus_map(func,arr){
    var a=[];
    for (var i=0,len=arr.length;i<=len;i++){
        var r=func(arr[i]);
        a.push(r);
    }
    return a;
}
var res=cus_map(function (arg) {
    return arg+1;
},arr);
console.log(res);

④闭包

function counter(){
    var count=0;
    var f =function(){
        count++;
        return count;
    }
    return f;
}
var res=counter();
console.log(res());
console.log(res());
console.log(res());