javascript(前端知识)----------基础语法

1 基础语法(和java类似）

一：我们都知道，java的运行，主要是靠JVM，JVM把.class文件(二进制字节码文件)加载到内存中，然后再来解析运行，然后再把java的字节码转化成CPU指令；

但是对于javascript来说，是浏览器先要加载HTML，HTML通过一些方式引入JS，JS的代码大多数是通过网络的方式被下载到浏览器上面，然后浏览器在调用V8引擎来解释执行JS的代码

DOM：浏览器提供了一组API，让JS可以操作网页中的元素；

BOM：浏览器提供了一组API，让JS来操作浏览器的窗口；

二： JS程序的写法：

1)行内式:直接嵌入到html元素的内部

<input type="button" value="你点我一下" onclick='alert("HelloWorld")'>
像onclick这样的属性，是可以嵌入一段JS的，它的功能是获取点击事件，当用户点击这个元素时，就会触发这个点击事件，进一步就触发了JS的代码；
 <div onclick='alert("你还真点呀")'>点我一下</div>

2) 内嵌式：直接写到script标签中

   alert("helloworld");//相当于java中的System.out.println

3 外部式：单独把他写到一个JS文件中

JS的输出语句：1）alert(),它的作用是弹出一个对话框，直接在网页上输出结果；

2）console.log(),在控制台里面打印一个日志，这是给程序员来看的

三：变量的使用：

1)创建变量:他是不需要指定显示类型的，在JS中，有用的数据类型只有两种，数字类型和字符串类型，而这两种类型的声明，都是用var/let来声明的,在JS中，可以用typeof来查看数据类型；

 var a=3;
  console.log(a)
  console.log(typeof(a));
   a="abcde";
  console.log(a)
  console.log(typeof(a))

同时也可以这么写

let a=10;
 console.log(a);
 console.log(typeof(a));
 a="a";
 console.log(a);
 console.log(typeof(a)

java是一个静态类型的语言，一个变量的类型，在编译阶段就已经确定了，运行时是不可以改变的，但是在JS中，他是一个动态类型的语言，变量的类型是在运行时可以进行改变的，变量的值和赋值的类型密切相关；

四：基本的数据类型：number:数字，不区分小数和整数，例如console.log(1/2)打印出来的值是0.5；

boolean类型:只有true和false两种类型

 var a=true;
 console.log(typeof(a));
这个代码打印出来的值是boolean

undefined:他只有唯一的值，表示从来没有被定义过的值，也就是说没有被初始化过；undefined与字符串进行相加，得到的是和字符串拼接的结果；当他与数字进行相加得到的结果是NaN;

null:只有唯一的值表示空值；他们俩都表示非法的概念

string:表示字符串类型，可以用length来求长度

NaN:表示不是一个整数

alert("hello"-10);此时打印出来的值就是NaN

在while循环中，如果条件是true,就执行循环体里面的代码 ;

parselnt是把字符串转化成整数

在JS中a||b表示如果a为true那么表达式的值就是a的值，如果a为false那么表达式的值就是b的值

使用==的时候是不会考虑类型的，如果想要考虑类型，就要用===来表示

let a=10;
let b="10";
console.log(a==b);这时打印的结果是false
console.log(a===b);这是打印的结果是true

——————————————————————————————————————————

2 数组

一：数组的创建方式

1 通过new关键字来创建

let arr1=new Array();
arr1[0]=1;
arr1[1]="hello";
arr1[2]="world";
arr1[3]="hi";
arr1[4]=2;
console.log(arr1);
此时数组的长度不知道，数组里面的元素类型都可以是任意的

2 通过[]来指定

let arr1=[1,2,"hello","world"];
console.log(arr1);
直接在console来指定一个数组名，就可以打印一个数组了
这是我们如果写arr1[10]="name"也是可以的
如果尝试写入数组不存在的下标，就会在这个下标里面添加元素，同时可能会修改数组的长度；但是中间元素的值，仍然是undefined

var arr1=[1,2,"helloworld"];
arr1[10]="var";
console.log(arr1.length);
此时打印的值就是11

我们可以超出数组范围来写元素，但是如果超出范围来读元素，独处的结果任然是undefined;

var arr1=[1,2,3,4,5,6,7];
arr1="hello";
一开始的时候arr1是一个数组，但是后来arr1被转化成字符串了

甚至我们可以给数组指定一个字符串类型的下标，此处下标与数组下表对应元素的关系，相当于是一个键值对

let arr1=new Array();
arr1["hello"]="world";
console.log(arr1["hello"]);
console.log(arr1);
console.log(arr1.hello);
arr1.hello=123;
console.log(arr1.hello);

显示的结果为：

注意： 数组里面的元素可以要求是不同类型的元素，如果数组下标越界，读取的数据就是undefined，写入的数据就相当于对数组进行了扩容；数组的下标不一定非得是数字，还可以是字符串，相当于动态的给数组添加了一些属性

二：数组中的常见操作

1）给数组里面追加元素

let arr1=new Array();
for(var i=0;i<10;i++)
{
   arr1.push(i);
}
console.log(arr1);

2）删除元素arr1.splice(a,b);第一个参数表示数组要进行开始删除的元素位置，第二个参数表示总共要删除的数组元素个数；

var arr1=[1,2,3,4,5];
arr1.splice(2,2);
console.log(arr1);
打印的结果是1，2，5

3 函数：

1语法格式：

function 函数名 参数列表（）
{   函数体
    return 返回值；
}

function hello(){
    console.log("hello");
}
hello();
function add(a,b)
{
    return a+b;
}
console.log(add("hello","world"));
console.log(add(5,3));
打印出来的值是helloworld,8

Js对于形参和实参的要求不需要指定类型，也不需要指定个数；对于参数个数来说

1 如果实参个数比形参个数多，那多出来的个数不参与函数运算

2 如果实参个数比形参个数少，那么此时多出来的值为undefined

function add(x,y){
    return x+y;
    
}
console.log(add(10));
console.log(add(10,20));
console.log(add(10,20,30));
此时打印的值是NaN,30,30

还可以这么写：定义一个函数，然后再把这个函数赋值给一个变量

var add=function(a,b,c,d){
    return a+b+c+d;
}
console.log(add(10,20));
console.log(add(1,2,3,4));
console.log(typeof add);
打印结果是NaN和10
这是我们定义了一个一个匿名，没有函数名的函数，把这个函数赋值给了另一个变量，那么就可以拿着这个变量来进行函数调用了

4 对象

在JS中，类这个概念是很模糊的

1 通过字面量来创建对象

  var a={};//这表示创建一个空的对象
     var student={
  name: "李佳伟",
  height:175,
  weight:208,
  sayhello:function(){
      console.log("hello");
  }
     };
     let teacher={
         name:"刘树军",
         age:19,
         sayhello:function(){
             console.log("world");
         }

     }
     let student1=student;
     console.log(student1.name);
     console.log(student1.height);
     student1.sayhello();
     student1=teacher;
     console.log(student1.name);
     student1.sayhello();

注意： 我们是通过{}来创建对象的，属性和方法要用键值对的形式来组织；其次，键值对之间要用:来分割；键和值之间使用，来分割;方法的值是一个匿名函数；当调用函数的时候，不要忘了写上小括号；

2 通过new Object()来创建对象：

  var student=new Object();
   student.name="郭宇泽";
   student.height=178;
   student.weight=200;
   student.sayhello=function(){
       console.log("hello");
   }
   console.log(student.name);
   student.sayhello();
这时我们就可以说，一个这样的对象有若干个这样的属性，并且可以进行动态新增

3 通过构造函数来创建对象：

基本语法：
function 构造函数名(形参){
     this.属性=值;
     this.方法=function....
}
var s1=new 构造方法名(实参);

注意：在构造函数时内部要写上this关键字来表示当前正在构建的对象，构造函数不需要return,创建对象的时候必须使用new关键字；

new 关键字的执行过程：1 现在内存中开辟一个空的对象；

2 this 指向刚才的空对象；

3 执行构造函数的代码，给对象创建对应的属性和方法

4 返回这个对象，本身不需要return,new代替了；

 function cat(name,age){
this.name=name;
this.gae=age;
this.hello=function(){
    console.log("我要对你说hello")
}}
let cat1=new cat("中华田园猫",20);
let cat2=new cat("波斯猫",19);
console.log(cat1.name+cat2.name+"正在一起玩");