二、细讲JavaScript基础语法
2.1.变量
2.1.1.定义一个变量
// 声明一个变量名为test的变量。 var test;
var age, name, sex;//声明age、name、sex三个变量
//同时声明变量并赋值 var age = 10, name = "小强", sex = "1";
2.1.2.变量命名规则及规范
1、由字母、数字、下划线、💲符号组成,不能以数字开头
2、不能使用关键字,例如:while
3、区分大小写
规范:约定俗成的写法
1、变量名要有意义.
2、遵守驼峰命名法,驼峰命名法:首字母小写,后面单词首字母大写,例如userName.
2.2.数据类型
其中数据类型有:Number类型、String类型、Boolean类型、Undefined类型、Null类型、Object类型
2.2.1.Number
Number数字类型:包含整数和小数
可以表示:十进制、八进制、十六进制
如:
var num = 10; //十进制 var num1 = 012; //八进制 var num2 = ox123; //十六进制
数值范围:
console.log(Number.MAX_VALUE); //最大值 值为5e-324 console.log(Number.MIN_VALUE); // 最小值 值为1.7976931348623157e+308 无穷大:Infinity 无穷小:-Infinity
数值判断不可以用小数验证小数以及不要用NaN验证是不是NaN (NaN----not a number) 但是可以用isNaN— is not a number结果是不是NaN
如:
var num; //声明一个变量,未赋值 console.log(isNaN(num)); // true 不是一个数字吗? 结果是true
2.2.2.String
字符串转义符:
eg:
var str = "iam a pm\\" console.log(str); // iam a pm\
字符串拼接:
var str1 = "先生"; var str2 = "您好"; console.log(str1+str2); // 先生您好
若是字符串和数字拼接 结果也是字符串 拼接效果如上所示
2.2.3.Boolean
布尔类型的话两个属性 true/false
2.2.4.Undefined
undefined表示一个声明了没有赋值的变量,变量只声明的时候值默认是undefined
如:
var num; console.log(num); // undefined
2.2.5.Null
Null表示一个空,变量的值如果想为null,必须手动设置
2.2.6.Object
2.3.数据类型的转换
2.3.1.转换成数值类型
(1)、Number()可以把任意值转换成数值,如果要转换的字符串中有一个不是数值的字符,返回NaN
如:
var num1 = Number("10"); console.log(num1); // 10 var num2 = Number('10adbdn'); console.log(num2); //NaN var num3 = Number("10.78"); console.log(num3); //10.78 var num4 = Number('10.65dd'); console.log(num4); //NaN var num5 = Number("a10"); console.log(num5); //NaN
(2)、parseInt()转整数
如:
var num1 = parseInt("10"); console.log(num1); // 10 var num2 = parseInt('10adbdn'); console.log(num2); //10 var num3 = parseInt("10.78"); console.log(num3); //10 var num4 = parseInt('10.65dd'); console.log(num4); //10 var num5 =parseInt("a10"); console.log(num5); //NaN
(3)、parseFloat()转小数
如:
var num1 = parseFloat("10"); console.log(num1); // 10 var num2 = parseFloat('10adbdn'); console.log(num2); //10 var num3 = parseFloat("10.78"); console.log(num3); //10 var num4 = parseFloat('10.65dd'); console.log(num4); //10 var num5 = parseFloat("a10"); console.log(num5);
(4)、Number()、parseInt()、parseFloat()三者的区别
Number()要比parseInt()和parseFloat()严格.
parseInt()和parseFloat()相似,parseFloat会解析第一个. 遇到第二个.或者非数字结束
2.3.2.转换成字符串类型
(1)、toString()
如:
var num = 10; console.log(num.toString()); // 字符串 10
(2)、String()
如:
var num1 =5; console.log(String(num1)); // 字符串 5
(2)、JSON.stringfy()
2.3.3.转换成布尔类型
0、空字符串、null 、undefined 、NaN 会转换成false 其它都会转换成true
如:
var num1 = Boolean(0); console.log(num1); // false var num2 = Boolean(""); console.log(num2); // false var num3 = Boolean(null); console.log(num3); // false var num4 = Boolean(undefined); console.log(num4); // false var num5 = 10; var num6; console.log(Boolean(num5+num6)); // false
2.4.运算符
运算符种类:算数运算符、复合运算符、关系运算符、逻辑运算符
(1)、算数运算符:“+”“-”“*”“/”“%”
算数运算表达式:由算数运算符连接起来的表达式 复合运
(2)、复合运算符:“+=”“-=”“*=”“/=”“%=”
复合运算运算表达式:由复合运算符连接起来的表达式
(3)、关系运算符:“>”“<”“>=”“<=”“”“=”“!=”“!==”
关系运算表达式:由关系运算符连接起来的表达式
(4)、逻辑运算符:“&&”“||”“!”
逻辑运算表达式:由逻辑运算符连接起来的表达式
表达式1 && 表达式2
如果有一个为false,整个的结果就是false
表达式1 || 表达式2
如果有一个为true,整个的结果就是false
! 表达式
表达式的结果是true,整个的结果为false
表达式的结果是false,整个的结果为true
2.5.运算符的优先级
由高到低:
() 优先级最高
一元运算符 ++ – !
算数运算符 先* / % 后 + -
关系运算符 > >= < <=
相等运算符 == != === !==
逻辑运算符 先&& 后||
赋值运算符
2.6.函数
2.6.1.简介
JavaScript中的函数就是对象。对象是“名/值”对的集合并拥有一个连到原型对象的隐藏连接。对象字面量产生的对象连接到Object.prototype。函数对象连接到Function.prototype(该原型对象本身连接到Object.prototype)。每个函数在创建时会附加两个隐藏属性:函数的上下文和实现函数行为的代码
2.6.2.函数使用
function functionname(){ 这里是要执行的代码 }
语法:
圆括号可包括由逗号分隔的参数:
(参数 1, 参数 2, …)
由函数执行的代码被放置在花括号中:{}
function name(参数 1, 参数 2, 参数 3) { 要执行的代码 }
函数参数(Function parameters)是在函数定义中所列的名称。
函数参数(Function arguments)是当调用函数时由函数接收的真实的值
函数的调用:
//此处创建一个函数sum function sum(num1, num2) { var result = num1 + num2; console.log("num1 + num2 = " + result); } // 函数调用 sum(10, 20);
立即执行函数:
$(function(){ //不只有函数 所有变量输出等等在这里写都是页面加载直接运行 sum() })
2.7.JavaScript正则表达式
2.7.1.创建正则表达式
字面量。语法:Reg = /pattern/modifiers; 字面量的正则由两个正斜杆组成//,第一个正斜杆后面写规则:/pattern[规则可以写各式各样的元字符|量词|字集|断言…]。第二个正斜杆后面写标识符/modifiers[g全局匹配 | i忽略大小写 | m换行匹配 | ^起始位置 | $结束位置] 标识符。
var Reg = /box/gi;
构造函数。语法 Reg = new RegExp( pattern , modifiers ); pattern ,modifiers此时是字符串。何种方法创建都是一样的,pattern 模式 模板,要匹配的内容,modifiers 修饰符。
var Reg = new RegExp("box","gi");
2.7.2.String中正则表达式方法
var str = 'a1b2c3a4a5', reg = /a/g; console.log(str.match(reg)); //["a", "a", "a"] var str = 'a1b2c3a4a5', reg = /a/; console.log(str.search(reg)); //0 var str = 'a1b2c3a4a5', reg = /a/g; console.log(str.replace(reg,function(){ console.log(arguments); return 5555; })); var str = 'a,b,c,d', reg = /,/g; //console.log(str.split(',')); //["a", "b", "c", "d"] console.log(str.split(reg)) //["a", "b", "c", "d"]
2.7.3.RegExp对象的方法
| 方法 | 描述 |
| RegExp.exec(String) | 在字符串中执行匹配搜索,返回首次匹配结果数组 |
| RegExp.test(String) | 在字符串中测试模式匹配,返回true或false |
2.7.4.修饰符
修饰符也称作标识符,可指定匹配的模式,修饰符用于执行区分大小写和全局匹配。
i忽略大小写匹配。
g全局匹配,没有g只匹配第一个元素,就不在进行匹配。
m执行多行匹配
var patt = /pattern/i; //忽略大小写匹配 var patt = /pattern/g; //全局匹配 var patt = /pattern/m; //执行多行匹配
2.7.5.元字符
在正则表达式中具有特殊意义的专用字符。
特殊的转译字符. \ /。
. 单个任意字符,除了换行符\n与制表符\r \ 转义字符,将具有特殊意义的符号转义成普通符号: \. \d 数字[0~9] \D 非数字 \s 空格 \S 非空格 \w 字符[字母|数字|下划线] \W 非字符 \b 单词边界( 除了 (字)字母 数字_ 都算单词边界) \B 非单词边界
var reg = /\./;//匹配. var reg = /\\/;//匹配\ var reg = /\//;//匹配/ var str = '\\'; var reg = /\\/g; console.log(reg.test(str)); //true
2.8.JavaScript常用对象
2.8.1.Date对象
Date对象是一个有关日期和时间的对象。它具有动态性,必须试用new关键字创建一个实例,如:
var Mydata=new Date();
Date对象没有提供直接访问的属性,只有获取和设置日期的方法,如下表
2.8.2.String对象
String对象是JavaScript提供的字符串处理对象,创建对象实例后才能引用,它提供了对字符串进行处理的属性和方法(类似java一样)具体如下表:
属性 length —返回字符串中字符的个数。
注意:一个汉字也是一个字符!!
2.8.3.Math对象
属性:
Math对象方法:
三角函数(sin(), cos(), tan(),asin(), acos(), atan(), atan2())是以弧度返回值的。可以通过除法Math.PI / 180把弧度转换为角度,也可以通过其他方法来转换。
例子1:写一个函数,返回从min到max之间的随机整数,包括min不包括max
function getRandomArbitrary(min, max) { return min + Math.random() * (max - min); }
例子2:写一个函数,生成一个长度为 n 的随机字符串,字符串字符的取值范围包括0到9,a到 z,A到Z
function getRandomInt(min, max) { return min + Math.floor(Math.random() * (max - min + 1)); } function randomStr(n){ var dict = '1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'; var str = ''; for(i = 0; i < n;i++){ str += dict[getRandomInt(0,62)]; } return str; } var str = getRandStr(10); console.log(str);







