JavaScript
特点
1.直译式脚本语言(代码不用预编译,在程序的运行过程中逐行进行解释)
2.一种动态类型、弱类型、基于原型的语言
3.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,在HTML网页上使用,用来给HTML网页增加动态功能,能在浏览器中实时浏览到交互效果。
4.兼容性问题: IE6、7、8是个怪胎,对JavaScript语法有兼容性问题,所以要写兼容写法。
5.花式写法很多,抽象:从简单入手,细细品味代码
alert ()弹窗
-
alert 就是英语中“警报”的意思,能够让页面弹出警告框。让浏览器弹出一个窗口,窗口里的内容就是alert()中的内容。
-
JS程序是顺序
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>hello</title> <script> // 弹窗 alert("hello word!"); // 控制台 打印 console.log() console.log("hello word!"); // 单行注释 ctrl+/ /* 多行注释*/ </script> </head> <body> <script type="text/javascript"> // type可以不写,写了一定要写对 </script> </body> </html>
控制台console.log()
1.控制台是 浏览器“检查”或者“检查元素”里面的功能,快捷键是 F12。英文叫做 console。程序运行后所产生的错误,都会在控制台中输出,控制台是调试程序的一个利器。语句中不能出现中文的符号,出现中文符号会出现语法错误:
2.有些时候我们想在控制台中自己输出点什么,那么就要使用语句:console.log();console 就是控制台,log 就是日志的意思,这里是动词,表示打印。console.log(“你好啊");
-
alert(“你好啊!”); 这是一条语句JS中的每条语句以分号 ; 结尾。如果语句是一行一行写的,没有分号结尾也是有效语句。但项目做好后,通常都会进行压缩,用软件把所有的空格、换行都去掉。此时,语句末尾的分号显得非常重要,如果去掉分号,将不能执行。注意:所有的符号都是英文的符号,不要用中文
<script type="text/javascript"> alert("你好");alert("帅");alert("哈哈哈哈");</script>
JavaScript空格、换行
JavaScript 语句和语句之间的换行、空格、缩进都不敏感,会忽略多余的空格。可以向脚本添加空格缩进,来提高其可读性。
注释
1.单行注释
//注释内容不可换行
<script type="text/javascript">
//我是一行注释
//再来一行
alert("你好");
</script>
-
块级/多行注释
/* 注释内容可以换行 */
<script type="text/javascript"> /* 我是一行注释 再来一行 再来一行 */ alert("你好"); </script>
3.注释用于提高代码的可读性编辑器里注释的快捷键一般是: ctrl+/注意:注释的符号,不能嵌套
书写方式
1.内部书写
在HTML文件中直接进行代码的书写,JS 写在
注意:这个 type必须写准确,可以不写,但是要写,一定要写准确,否则失效。
<script>
// 1.使用script标签引入js,script标签可以放在任何位置
console.log("内部引入");
</script>
2.外部引入
<!-- 使用外部js,类似于css的引入
可以在任何地方引入 -->
<script src="js/a.js"></script>
3.直接写在HTML标签内(不推荐使用)
<!-- 在标签内使用,不建议 -->
<button onclick="alert('你好啊!')">点一下</button>
标识符
1.就是一个名字,用来对变量、函数、属性等进行命名。
2.标识符命名规范:
第一个字符必须是一个字母、下划线(_)或一个美元符号($);
其他字符可以是字母、下划线、美元符号或数字;
不能含有空格;
不能以关键字或保留字命名。
-
关键字、变量、函数名及所有的标识符都区分大小写
比如:变量ABC; 和 变量abc;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>变量标识符</title> </head> <body> <script> // 标识符:字下美其后数(字母 下划线 美元 数字) // 见名知意 // var age;sex;phone;email;adress; // 声明 var name; // 赋值 = name="小马"; // 边声明边赋值 var age=18; // 一次声明多个变量 var a,b,c,d; a=10; b="试试"; c="ff"; d=32.5; // 张三,20,男,爱好:女 var name1="张三"; var age1=20; var sex1="男"; var hobby1="女"; console.log(name1); console.log(age1); console.log(sex1); console.log(hobby1); // 变量使用前必须先声明才可以使用 // console.log(name2); // 变量可以不声明直接赋值并使用,不建议使用 name3="张三丰"; console.log(name3); // 声明,未赋值的变量,使用时会出现错误提示 undefined var aaa; console.log(aaa); </script> </body> </html>
关键字
关键字可用于表示控制语句的开始或结束,或者用于执行特定操作等。Javascript 中的很多内置功能用关键字标注起来,便于程序员调用。按照规则,关键字也是语言保留的,不能用作标识符。
例:break do instanceof typeofcase else new varcatch finally return voidcontinue for switch whilefunction this with defaultif throw delete intry
保留字
保留字有可能在将来被用作关键字来使用,不能用作标识符。
例:abstract int short booleanexport interface static byteextends long super charfinal native class floatthrows const goto privatedouble import public
变量
1.变量是存储信息的容器.
JavaScript的变量为弱变量,可以用来保存任何类型的数据。
C语言,JavaScript,int定义整型数据,char定义字符型,float定义浮点型,
在JS中,只有var这一种声明变量的类型,它可以声明各种类型的数据
2.定义变量——使用关键字 var 声明。var 就是英语 variables 变量的缩写
var a; 定义一个变量a,电脑内存中,就会开辟一个空间,来存储这个变量 a。可以给这个变量赋值,JS 中给变量赋值用等号,等号右边的值赋给左边
var a=20;
console.log(a);
可以通过var声明多个变量,变量与变量之间以,逗号隔开
var a=20,b=100;
console.log(a,b);
变量的命名规范
1.第一个字符必须是一个字母、下划线(_)或一个美元符号($);
2.其他字符可以是字母、下划线、美元符号或数字;
3.不能含有空格;
4.不能以关键字或保留字命名.
变量须先声明
使用一个变量,必须先进行一个 var,才能使用。 var 这个过程可以叫做声明 declaration,也可以叫做定义 definition。
直接运行语句:
console.log(b); //这个 b 没有通过var声明,所以要报错
变量的赋值
变量的赋值用等号,等号就是赋值符号
变量声明的提升
1.JS 只能提升变量的声明,而不能提升变量的赋初值
2.没有通过var定义变量,程序没有报错,正常输出值。但用var和不用var定义变量是有区别的,作用域那一节再具体讲述。
字面量
1.在计算机科学中,字面量(literal)是用于表达源代码中一个固定值的表示法(notation)。由字母,数字等构成的字符串或者数值,它只能作为右值出现,所谓右值是指等号右边的值。
2.字面量分为:字符串字面量(string literal )、数字字面量、数组字面量(array literal)和对象字面量(object literal),另外还有函数字面量(function literal)。
var a=1; // 1是数字字面量
var b=“你好”; // ”你好“ 是字符串字面量
var c=[1,2,3]; // [1,2,3]是数组字面量
var d={“age”:”10”} // {“age”:”10”}是对象字面量
function myFunction(a, b) { return a * b;} // 函数字面量
区分变量还是字面量
输出变量的时候,不能加引号。如果变量加上引号,就变成字符串了.
var a = 100;
console.log(“a"); // 这里输出a,而不是输出100
引号是“字符串”的定界符,在双引号里面的 a 已经失去了变量的意思,代表的就是一个字符串 a。
数据类型
1.可分为原始类型和对象类型,也可以分为可变类型和不可变类型。
2.可变类型的值是可修改的。对象和数组属于可变类型;数字、布尔值、NULL和undefined属于不可变类型。字符串可以看成由字符组成的数组,但是是不可变的。
3.五种原始数据类型
Number 值是数字
String 值是字符串
Boolean 值为布尔值 只有true或false—真或假
Undefined 值未定义
Null 值为空 (空对象)
4.一种复合数据类型 Object
对象object、数组Array、函数Function等都属于object类型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>数据类型</title>
</head>
<body>
<script>
// number 数字
var a=12;
var b=32.4;
var c=-99;
// 八进制 第一位是0后边是0~7组成的数字
var d=0o123;
console.log(d);
// 运行没有错误,但是代码会报错,不影响
// var e=0123;
// console.log(e);
// 十六进制 前面两位必须是0x 后面跟任何十六进制数字(0~9和a~f)a和f不区分大小写
var f=0x789;
var g=0xABC;
// String
// 字符串 是存储字符的变量
// 必须用双引号或者单引号包裹着
var h="你好";
var i='你好';
// 如果变量的标识符被加上引号,就不再是变量,就变成了字符串
var j="f";
// 你好"张三"
var k='你好"张三"';
console.log(k);
var l="你好'张三'";
console.log(l);
// 你是"狗"么?不是'狗'
var m="你是\"狗\"么?不是'狗'";
console.log(m);
var n="d:\\a\\a.html";
console.log(n);
var o="hello \nword!";
console.log(o);
// 检测数据类型
console.log(typeof a);
console.log(typeof o);
console.log(typeof 2);
console.log(typeof 'sdfghj');
console.log(typeof "3");
// boolean 布尔类型 true false
// true和false不能加引号
var p=true;
var q=false;
// underfined类型
// 使用var声明变量但未对其赋值,这个变量就是undefined。
var r;
console.log(typeof r);
// 空 null类型 检测null是会是obiect
var s=null;
console.log(typeof s);
</script>
</body>
</html>
数据类型检测
数据类型检测:typeof(x) 或 typeof x
例:var a = 100;
var b =“小明”;
console.log(typeof a); // 输出number
console.log(typeof b); // 输出string
string类型
1.字符串是存储字符的变量。
2.字符串的字面量,必须用双引号、单引号包裹起来。
字符串被限定在同种引号之间,即必须是成对单引号或成对双引号。
var str1=“今天天气很好”;
必须是同种引号,下面的写法是错误的:var str2=‘哈哈”;
一个数字用引号包裹起来,就是字符串类型:var str3=“3”;
3.正常情况下,双引号里面只能用单引号或者单引号里只能用双引号:
var str4=“老师说你像’考拉’一样漂亮”;
var str5=‘老师说你像"考拉"一样漂亮’;
4.双引号内部如果要使用相同的引号,可以使用 \ 反斜杠进行转义:
var str6=“老师说你像"考拉"一样漂亮";
反斜杠自己也用反斜杠来转义:
var str7=“c:\a\b.jpg”);
5.常用的转义字符:
\n 回车换行var str8=“你好\n啊\n我是谁\n啊”;
Boolean类型
1.布尔(逻辑)只能有两个值:true 或 false。布尔值常用在条件测试中.
var a=true;
var b=false;
2.Boolean类型中,字符串、非 0 数字、对象,将返回true ;空字符串、数字0、undefined、 null、NaN,将返回 false。
Boolean类型转换
把其它类型转化为Boolean的方法:
Boolean() 属于强制类型转换方法
Undefined类型
使用var声明变量但未对其赋值,这个变量就是undefined。
var a;
console.log(a); //undefined
声明变量以后输出和未声明变量输出区别:
var a; console.log(a); //undefined
console.log(b); //没有声明b,报错
Null类型
从逻辑角度看,null值表示一个空对象指针,所以typeof操作符检测null时会返回“object”。
var a = null;
console.log(typeof a); //object
Undefined值派生自null,所以ECMA-262规定对它们的相等性测试要返回true。
console.log(null == undefined); //true
console.log(null === undefined); //false
Null和Undefined类型的用法(在此只做了解)
null和undefined基本是同义的,只有一些细微的差别,典型用法是:
null表示”没有对象”,即该处不应该有值。
(1) 作为函数的参数,表示该函数的参数不是对象。
(2) 作为对象原型链的终点。undefined表示”缺少值”,就是此处应该有一个值,但是还没有定义。(1)变量被声明了,但没有赋值时,就等于undefined。
(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。
(3)对象没有赋值的属性,该属性的值为undefined。
(4)函数没有返回值时,默认返回undefined。
Number类型
JavaScript 唯一的数字类型,不再细分为整型int、浮点型float等.
数字字面量:十进制、八进制和十六进制
十进制数:最基本的数字
var a=34;
var b=100;
八进制数:八进制字面值第一位必须是零,后面的数字必须是0~7之间的数,超出范围 ,前面的零被忽略,数值当作十进制解析.
var num1=070; //八进制的56
var num2=079; //无效的八进制,解析为79
var num3=08; //无效的八进制,解析为8
十六进制数:十六进制字面值前两位必须是0x,后跟任何十六进制数字(09和AF)。A~F不区分大小写。
var num1 = 0xA; //十六进制的10
var num2 = 0x1f; //十六进制的31
提示:尽管所有整数都可以表示为八进制或十六进制的字面量,但所有数学运算返回的都是十进制结果.
Number类型转换
把其它类型转化为number的方法:
1.Number () 属于强制类型转换方法
把变量的值转换为数字,转换的是整个值,而不是部分值。如果变量的值无法转换为数字,那么 Number() 函数返回 NaN。
2.parseInt (string,radix) 可解析一个字符串,并返回一个整数。
string 必填项,表示要解析的字符串;
radix 可选项,表示要解析的数字的基数(进制数)。介于2-36之间,如果该参数小于2或者大于36,则parseInt()将返回NaN。
注意:只有字符串中的第一个数字会被返回。开头和结尾的空格是允许的。如果字符串的第一个字符不能被转换为数字,那么 parseInt() 会返回 NaN
3.parseFloat (string) 可解析一个字符串,并返回一个浮点数。
注意: 开头和结尾的空格是允许的。 如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN。 如果只想解析数字的整数部分,请使用 parseInt() 方法。
4.什么情况下会产生NaN?
NaN(Not a Number的缩写)是number类型里的特殊值,当做数学运算失败的时候,或当其它数据类型转化为number类型失败的时候,会得到NaN的结果。
5.isNaN() 用于检查变量是否是非数字值。
如果把NaN 与任何值(包括其自身)相比得到的结果均是 false,所以要判断某个值是否是 NaN,不能使用 == 或 === 运算符。正因为如此,isNaN() 函数是必需的。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>js数据转换</title>
</head>
<body>
<script>
// Number() 把变量强制转换成数字
// NaN 非数字
var str1="123";
var str2="0o1234";
var str3="0xA123F4";
var str4="aa";
var str5='a';
console.log(Number(str1));
console.log(Number(str2));
console.log(Number(str3));
console.log(Number(str4));
console.log(Number(str5));
console.log("-----------------------------");
// 转换成整数 parseInt
console.log(parseInt("123.8"));
console.log(parseInt("1234a5"));
console.log(parseInt("a123"));
console.log(parseInt("1.2.3"));
console.log(parseInt(null));
console.log(parseInt(false));
console.log("-----------------------------");
// 转换为浮点数(小数)
console.log(parseFloat("123"));
console.log(parseFloat("123.33"));
console.log(parseFloat("123.3.4"));
console.log(parseFloat(" 123.2"));
console.log("-----------------------------");
// 检查是不是 非数字 false-->数字 true-->非数字
console.log(isNaN(123));
console.log(isNaN("123"));
console.log(isNaN("a"));
// console.log(isNaN(c));
</script>
</body>
</html>