javascript的概念
javascript描述的是网页的行为。一个完整的 JavaScript 实现是由以下 3 个不同部分组成的:
ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。
DOM:指文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。
BOM:操作浏览器部分功能的API。比如让浏览器自动滚动。
1.javascript的引入方式
1.Script标签内写代码
<script>
// 在这里写你的JS代码
</script>
2.引入额外的JS文件
<script src="myscript.js"></script>
2.JavaScript的特点
(1)简单易用:可以使用任何文本编辑工具编写,只需要浏览器就可以执行程序。
(2)解释执行(解释语言):事先不编译、逐行执行、无需进行严格的变量声明。
(3)基于对象:内置大量现成对象,编写少量程序可以完成目标
3.JavaScript的注释:
单行注释:// 我是注释
多行注释: /*多行注释1*/
sublime中,单行注释的快捷键是ctrl+/,多行注释的快捷键是ctrl+shift+/
JavaScript中的语句要以分号(;)为结束符。
4.变量声明:
1.在JavaScript中,永远都是用var来定义变量
2.JavaScript的变量名可以使用_,数字,字母,$组成,不能以数字开头
3.一行可以声明多个变量.并且可以是不同类型.
var name="jerd",age=20,hobby="basketball";
5.JavaScript在网页中输出信息的写法:
1.弹出警告框:alert("")
2.控制台输出:console.log("") console表示“控制台”,log表示“输出”。
3.用户输入:prompt()语句
<script type="text/javascript">
var a = prompt('今天是什么天气?');
console.log(a);
</script>
上方代码中,用户输入的内容,将被传递到变量 a 里面。
prompt()语句中,用户不管输入什么内容,都是字符串。
alert和prompt的区别:
alert("从前有座山"); //直接使用,不需要变量
var a = prompt("请输入一个数字"); // 必须用一个变量,来接收用户输入的值
javascript的数据类型
数字类型Number
Number:JavaScript不区分整型和浮点型,就只有一种数字类型
var a = 123;
//typeof 检查当前变量是什么数据类型
console.log(typeof a)
NaN,表示不是一个数字,该属性用于指示某个值不是数字。
parseInt("123") // 返回123
parseInt("ABC") //NaN
布尔类型Boolean
区别于Python,true和false都是小写。
var a = true;
var b = false;
""(空字符串)、0、null、undefined、NaN都是false。
字符串String
var a = "Hello"等同于 var a=String("hello") 不加引号会报错
如果值为数字,可不加引号
字符串拼接:
ar a = "Hello"
var b = "world;
var c = a + b; #用+作字符串的连接
console.log(c); // 得到Helloworld
var name="伊拉克
var am = '美军';
// 字符串拼接
var str = "2003年3月20日,"+name+"战争爆发,以美军为主的联合部队仅用20多天就击溃了萨达姆的军队。这是继十多年前的海湾战争后,"+am+"又一次取得的大规模压倒性军事胜利。"
var fullStr = str;
console.log(fullStr)
#2003年3月20日,伊拉克战争爆发,以美军为主的联合部队仅用20多天就击溃了萨达姆的军队。这是继十多年前的海湾战争后,美军又一次取得的大规模压倒性军事胜利。
常用方法:
1.length 返回长度
a=" jerd jerry ";
console.log(a.length);#12
2..trim()移除两端空白。不能自定义
console.log(a.trim()); #jerd jerry
.trimLeft()去除左边的空白 console.log(a.trimLeft());
.trimRight() 移除右边的空白
3..charAt(n)返回第n个字符
console.log(a.charAt(2)); #e
4..concat(value, ...) 拼接
console.log(a.concat(888)) # jerd jerry 888
5..indexOf(substring, start)子序列位置。显示字符串中第一个元素所在的位置
console.log(a.indexOf("je")); #1
console.log(a.indexOf("jerd")); #1
6..substring(from, to) 根据索引获取子序列
console.log(a.substring(0,6)); #jerd
##第二个参数为负数时,相当于显示第一个参数之前的索引对应元素
console.log(a.substring(0,-1)); #为空
console.log(a.substring(5,-1)); #jerd
7..slice(start, end) 切片
# console.log(a.slice(0,6));#jerd
console.log(a.slice(0,-1)); #jerd jerry
# console.log(a.slice(5,-1));#jerry
c.slice(3,1); ""
8..toLowerCase()小写 toUpperCase() 大写
# console.log(a.toUpperCase(5,-1));JERD JERRY
9..split(delimiter, limit)分割
c=" jerry jerd ";
c.split(" "); ["", "jerry", "jerd", ""]
如果设定切割个数,则只显示分割处之前的元素
console.log(a.split(" ",1)); #[""]
console.log(a.split(" ",2));#["", "jerd"]
注意substring和slice的区别:
两者的相同点:
如果start等于end,返回空字符串
如果stop参数省略,则取到字符串末
substirng()的特点:
如果 start > stop ,start和stop将被交换
如果参数是负数或者不是数字,将会被0替换
slice()的特点:
如果 start > stop 不会交换两者。值为空
如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)
null和undefined
null:
var c1 = null;//空对象. object
console.log(c1) #null
console.log(typeof c1) #object
#undefined
undefined
var d1 //表示变量未定义
console.log(typeof d1)
null表示值是空,一般在需要指定或清空一个变量时才会使用,如 name=null;
undefined表示当声明一个变量但未初始化时,该变量的默认值是undefined。还有函数无明确的返回值时,返回的也是undefined。
null表示变量的值是空,undefined则表示只声明了变量,但还没有赋值。
类型查询
typeof "abc" // "string" #字符串类型
typeof true // "boolean" #布尔类型
typeof 123 // "number" #数字类型
var a console.log(typeof a) //undefined - 如果变量是 Undefined 类型的
object - 如果变量是一种引用类型或 Null类型的(数组也是此类型)
typeof null // "object"
a=[11,12,14];
console.log(typeof a); #object
typeof是一个一元运算符(就像++,--,!,- 等一元运算符),不是一个函数,也不是一个语句。
类型转换
1.Number ----->> String
隐式转换:
var n1 = 123;
var n2 = '456';
var n3 = n1+n2;
console.log(n3) 123456
console.log(typeof n3) //string
强制类型转换String(),toString()
var a=123
var b=String(a)
console.log(typeof b) #string
console.log(a.toString())
2.String ----->>Number
Number(str)和parseInt(str)
1.var a="123";
var b=Numner(a)
typeof b; //"number"
2.字符串中有非数字元素时,值为NaN
var c="1234nhjk";
var d=Number(c);
d; //NaN
typeof d; //"number"
3.parseInt()可以解析一个字符串有非数字元素时自动舍去 并且返回一个整数
e=parseInt(c) //1234
var stringNum = '789.123wadjhkd';
console.log(parseInt(stringNum)) //789
console.log(parseFloat(stringNum)); //789.123
3.任何数据类型都可以转换为boolean类型
console.log(Boolean(变量))
javascript的运算符
1.算数运算符
+ - * / % ++ --
2.赋值运算符
= += -= *= /=
3.比较运算符
> >= < <= != == === !==
==只比较值,不比较类型
===值和类型都相等
console.log( 2>"1"); #true
console.log( 2>"ab");#false
1 == “1” // true
1 === "1" // false
4.逻辑运算符
&& 相当于and
|| or
! not
javascript的流程控制
if-else
if (a>6){
console.log("The ending is good");
}else {
console.log("The ending is bad");
}
# The ending is bad
if else-if else
if (a>6) {
console.log("The ending is good");
}else if(a>4) {
console.log("The ending is just soso")}else {
console.log("The ending is bad");
}
# The ending is just soso
switch case
var a=5;
switch(a) {
case 0:console.log("The ending is C");
break;
case 1:console.log("The ending is B");
break;
case 5:console.log("The ending is A");
break;
default:console.log("The ending is bad");
}
#The ending is A
逻辑与&&、逻辑或||在if中的使用
if(sum>400 && math>90){
console.log("A")
}
if(sum>400 || math>90){
console.log("B")
}
for
for (var i=0;i<10;i++) {
console.log(i);
}
用for(b in li) b为索引,并不是具体的值
var b;
li=[1,2,3];
for(b in li){
console.log(li[b]);
}
while
var i = 0;
while (i < 10) {
console.log(i);
i++;
}
三元运算
var a = 1;
var b = 2;
var c = a > b ? a : b #如果结果为真,就执行a 否则执行b