<1> js的概念
一种脚本语言。 作用:提供页面和用户交互途径。 ① ES(ECMAScript) 基础语法 ES5 ES6 ② DOM(document object model 文档对象模型) 对html页面中标签,属性,文本操作;(也就是选择标签,属性所在的代码块中的文本,按钮,下拉框等进行操作 的工具集合) ③ BOM (Bowser object model 浏览器对象模型) 对浏览器的操作(即设置浏览的网页的宽,高,打开新的网页,前进后退和历史等一系列操作的对象模型,按本人理解就是一个网页操作的工具或者说是一种模式);<2>JS定义在哪里
1.写在标签里面 <button type="button" onclick="alert('我是js代码')">按钮</button> 2 在script标签里面 <script type="text/javascript"> alert('我js代码'); </script> 这个script可以放在head标签内部,也可以放在body标签内部 3 单独写在js的文件里面 在js目录中新建一个 xxxx.js文件 <script src="./js/demo.js" type="text/javascript" charset="utf-8"> </script> script如果通过src指向js目录中的文件,就可以把两者连在一起,并且《script中不允许再写代码》;<3>JS的注释
<!-- HTML注释 --> /* css的注释 */ JavaScript中的注释 // 单行注释 /* 多行注释 */<4>JS代码出错了调试方式
一定要到控制台找! 一定要到控制台找! 一定要到控制台找! 《重要的事情说三遍》<5>ES语法 1 js 是严格区分大小写的 2 js 每句代码结束,添加; 分号 3 所有的标点符号,都是半角的
1声明变量 //java中定义变量 int x=10; // js中 // var 是变量的标识符,告诉浏览器var关键字后面跟着是变量 var age; var name; var sex; 标识符的命名规范: 由字母,数字,下划线,美元符号组成,不能以数字开头 变量名不能使用js中内置的关键字或者保留字 见名知义,驼峰命名法,多个单词, 从第2个单词开始每个单词首字母大写
2 变量的赋值. var name; name=“Jack”; //第1次赋值 name=“rose”; //第2次赋值 var uname,upwd; //定义两个变量 uname=“admin”; upwd=“123456”; var age=10; //定义与赋值同时完成
3 js中关键字 4. 数据类型
字符串(String)、数字(Number)、布尔(Boolean)、数组(Array)、对象(Object)、空 (Null)、未定义(Undefined)。 JavaScript 拥有动态类型 JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型: var x; console.info(typeof x); //undefined var x=10; console.info(typeof x); //number var x=“qiufen”; console.info(typeof x); //string var x=true; console.info(typeof x); //boolean var x=[1,2,3,4]; console.info(typeof x); //object
①number 数字类型不需要加引号 var age=18; var money=-5000.5; var height=160.1; //在js中计算小数类型,也会有精度问题
② string 使用引号括起来(单引号|双引号) var x=“你好”; var y=‘不好’; var z=‘18’;
③ boolean 它有两个固定的值 true 和 false var f1=true; // boolean var f2=false; //boolean var f3=“true”; //string
④ undefined 未定义类型 定义了变量,又不对这个变量进行赋值 var a; // 没有给a赋值,则a就是未定义类型 var b=undefined; //手动赋值为undefined类型’
⑤ null 空类型 var a; //未定义类型 undefined var b=null; // 空类型 变量b有一个房子,房子里面是空的, 变量a房子都没有
⑥ object对象类型 var arr=[1,2,3,4]; //数组 var dog={name:‘哈士奇’,age:3}; //对象
5 如何查看数据类型: typeof 变量名 // 检查此变量名的数据类型 6 数据类型的转换 ① 字符串转数字
前提要求: 必须是数字字符串才可以转换 var x="123";//string 使用Number(字符串来进行转换) var y=Number(x); // number②如何将其他类型转换成字符串
在js里面,可以将所有的数据类型转换成字符串 1. String() var a=123; var x1=String(a); 2. 在后面添加一个空字符串 var a=123; var x1=a+""; 3. toString() 4. var a=123; var x1=a.toString();7.运算符
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js运算符</title> </head> <body> <script type="text/javascript"> //① 一元运算符 var x=10; x++; ++x; console.log(x); var a=10;// 11 var b=20; var c=30; var d= ++a + ++b + c++ + a--; // 11 + 21 + 30+11 console.info(d); var y=-x; //② 逻辑操作符 var f1=true; var f2=false; console.info(!f1); //逻辑非 console.info(f1&&f2); //逻辑与 console.info(f1||f2); //逻辑或 //③ 算术运算符 // + - * / % == === != console.info(1+2); console.info(1+null); // 1 console.info(1+undefined); //NaN console.info("1"+undefined); console.info(10/3); //不是整除 console.info(10%3); console.info(1=="1"); //等于 console.info(1==="1"); // 全等 console.info(1!=2); //不等于 // > < >= <= // 三目运算符 var m1=10; var m2=20; var max=m1>m2?m1:m2; console.info(max); //赋值运算符 var k1=10; k1+=10; k1/=10; </script> </body> </html>8.流程控制 if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码 if…else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码 if…else if…else 语句- 使用该语句来选择多个代码块之一来执行 switch 语句 - 使用该语句来选择多个代码块之一来执行 1> ①if if(条件1){
}else if(条件2){
}else if(条件3){
}else{ } ②switch switch(n) { case 1:执行代码块 1 break; case 2: 执行代码块 2 break; default: 执行的代码 } 2>循环语句 for - 循环代码块一定的次数 for/in - 循环遍历对象的属性 while - 当指定的条件为 true 时循环指定的代码块 do/while - 同样当指定的条件为 true 时循环指定的代码块 for语句
for (var i=开始; i<结束; i++) { //循环体 } for(var i=1;i<=9;i++) { for(var j=1;j<=i;j++){ document.write(j+"*" +i+"="+ j*i +" "); } document.write("<br/>"); }for in 语句
//定义一个对象 var dog={name:"哈士奇",age:2,sex:"公"}; //根据属性名,获取属性值 console.info(dog['name']); console.info(dog.name); //对象名.属性名 for (x in dog) // x就是属性名 { console.info(x + dog[x]); } var arr=[10,20,30]; for( i in arr) { // i就是数组的索引值 console.info(i +"---" + arr[i]); }还有while和do while循环,在这里就不做过多赘述 10 变量的作用域 局部变量 只有定义在函数中的变量,称为局部变量 全局变量 与局部变量相反