目录
- js代码引入
- 变量声明
- 数据类型
- 数值类型(number)
- 字符串(string)
- 字符串 转换 数值类型
- 字符串相关方法
- 布尔值
- null和undefined
- object类型
- 数组
- 数组常用方法
- 运算符
- 算数运算符
- 比较运算符
- 逻辑运算法
- 赋值运算法
- 流程控制
- if判断
- switch切换
- for循环
- while循环
- 三元运算
- 函数
- 定义函数
- 函数的全局变量和局部变量
- 作用域
- 面向对象
- date对象
- JSON对象
- RegExp对象
- Math对象
js代码引入
方式1:
方式2:外部文件引入
src属性值为js文件路径
变量声明
变量名是区分大小写的。
推荐使用驼峰式命名规则。首字母大写
保留字不能用做变量名。
var a = 1;数据类型
数值类型(number)
示例:
var a = 1;
var b = 1.1;
var c = 123e5; // 12300000 e5 *10的5次方
var d = 123e-5; // 0.00123
typeof a; --- number
typeof b; --- number字符串(string)
var a = '陈硕男技';
typeof a; --- "string"字符串 转换 数值类型
parseInt:
var a = '111';
var b = parseInt(a);
typeof b; --- "number"
parseFloat:
var a = '1.11';
var b = parseFloat(a);
var a = 'bbbb1';
var b = parseInt(a);
b = NaN NaN是not a number
typeof b; --- number类型 NaN和NaN不相等字符串相关方法
字符串拼接
var a = "Hello"
var b = "world"
var c = a + b;
console.log(c); --- Helloworld
.length 查看字符串长度
示例:
var c = 'hello';
c.length; -- 5
.trim() 移除两端空格,得到一个新值,不会改变原来的值
示例:
var a = ' hello ';
var b = a.trim();
.trimLeft()
.trimRight()
.charAt(n) 找到索引为n的字符
var c = b.charAt(1);
.concat() 字符串拼接
示例:
var a = 'nihao';
var b = 'girls';
var c = a.concat(b);
.indexOf() 查看元素的索引
示例:
var a = c.indexOf('a');
var a = c.indexOf('i',3); 参数3的意思是从索引3的位置开始往后找,找到就返回对应的索引值,找不到就返回-1
.slice() 切片
示例:
var c = "nihaogirls";
var a = c.slice(0,5); -- 'nihao'
.toLowerCase() #全部变小写
.toUpperCase() #全部变大写
示例:
var c = "nihaogirls";
var a = c.toUpperCase();
.split() 字符串切割
示例:
var c = "nihaogirls";
var a = c.split('g',1); 'g'是切割条件,1是切割后,返回结果的数量布尔值
var a = true;
var b = false;
// 数据类型都有布尔属性:
//""(空字符串)、0、null、undefined、NaN都是false。null和undefined
/*null表示值是空，一般在需要指定或清空一个变量时才会使用，如 name=null;
undefined表示当声明一个变量但未初始化时，该变量的默认值是undefined。还有就是函数无明确的返回值时，返回的也是undefined。
var a; -- undefined
null表示变量的值是空，undefined则表示只声明了变量，但还没有赋值。*/object类型
var a = "xx";
var b = new String("oo");数组
var a = [11,22,33];
typeof a; // "object"
var b = new Array([11,22,33,44]);
typeof b; // "object"数组常用方法
var a = [11,22,33];
/*索引取值*/ -- a[0];
/*数组长度 */-- a.length;
/*尾部追加 */-- a.push(44);
/*尾部删除 */-- a.pop()
//示例:
var a = [11, 22, 33, 44];
var b = a.pop();
// 结果:
a -- [11, 22, 33]
b -- 44
/*头部添加 -- a.unshift('aa')
示例:*/
var a = [11, 22, 33];
a.unshift('aa')
a -- ["aa", 11, 22, 33]
/*头部删除 -- shift()
示例:*/
var a = ["aa", 11, 22, 33];
a.shift() -- 'aa'
a -- [11, 22, 33];
/*切片*/ -- slice()
var b = a.slice(0,3);
b -- [11, 22]
/*反转*/ reverse()
var a = [11,22,33];
a.reverse()
a -- [33,22,11]
/*
数组元素拼接 join
示例:*/
var a = ['aa','bb','cc'];
var b = a.join('_');
b -- "aa_bb_cc";
//数组合并 concat
var a = ["aa", "bb", "cc"];
var b = [11,22];
var c = a.concat(b);
c -- ["aa", "bb", "cc", 11, 22];
//排序 sort 比较尬
// 示例:
var a = [12,3,25,43];
// 对a进行升序排列:
// 1 定义函数
function sortNumber(a,b){
return a - b
};
2 var b = a.sort(sortNumber)
b -- [3, 12, 25, 43]
/*
sort 规则:
如果想按照其他标准进行排序，就需要提供比较函数，也就是自己提供一个函数提供排序规则，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：
若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0。
若 a 大于 b，则返回一个大于 0 的值。
删除 .splice()
示例:
*/
var a = ['aa','bb',33,44];
/*单纯删除:*/ a.splice(1,1)
a -- ["aa", 33, 44]
//删除在替换新元素:
var a = ["aa", 33, 44];
a.splice(0,2,'hello','world');
a -- ["hello", "world", 44];
/*三个参数介绍:
参数：1.从哪删(索引), 2.删几个 3.删除位置替换的新元素(可多个元素)*/运算符
算数运算符
/* + - * / % ++ -- i++,是i自加1，i--是i自减1 i++的这个加1操作优先级低，先执行逻辑，然后再自加1，而++i，这个加1操作优先级高，先自加1，然后再执行代码后面的逻辑
*/
//示例:
var a = 100;
a++;//或者++a; -- 101 a自增1
//a++和++a的区别,示例:
var a = 102;
a++ == 102;// -- true
a -- 103;
++a == 103; //-- false
a -- 104;比较运算符
/* > >= < <= != == === !==
==(弱等于)和===(强等于)两者的区别:
示例:*/
var a = 11;
var b = '11';
a == b -- true
a === b; -- false逻辑运算法
/*&& || ! #and，or，非（取反）!null返回true
示例:*/
var a = true;
var b = true;
var c = false;
a && b; //-- true
a && c; //-- false
a || c; //-- true
!c; //-- true赋值运算法
/*= += -= *= /=
示例: n += 1其实就是n = n + 1*/流程控制
if判断
//简单if-else判断
var a = 4;
if (a > 5){
console.log('a大于5');
}
else{
console.log('小于5');
};
//多条件判断
var a = 10;
if (a > 5){
console.log("a > 5");
}else if(a < 5) {
console.log("a < 5");
}else {
console.log("a = 5");
}switch切换
示例:
var a = 1;
switch (a++){ /*这里day这个参数必须是一个值或者是一个能够得到一个值的算式才行，这个值和后面写的case后面的值逐个比较，满足其中一个就执行case对应的下面的语句，然后break，如果没有加break，还会继续往下判断*/
case 1:
console.log('等于1');
break;
case 3:
console.log('等于3');
break;
default: case都不成立,执行default
console.log('啥也不是!')
}
for循环
for (var i=0;i<10;i++) { //就这么个写法，声明一个变量，变量小于10，变量每次循环自增1，for(;;){console.log(i)}；这种写法就是个死循环，会一直循环，直到你的浏览器崩了，就不工作了，回头可以拿别人的电脑试试~~
console.log(i);
}
//循环数组：
var l2 = ['aa','bb','dd','cc']
//方式1
for (var i in l2){
console.log(i,l2[i]);
}
//方式2
for (var i=0;iwhile循环
var i = 0;
var a = 10;
while (i < a){
console.log(i);
if (i>5){
continue;
break;
}
i++;
};三元运算
var c = a>b ? a:b; 函数
定义函数
//普通函数
function f1(){
console.log('111');
}
f1(); //执行函数
//带参数的函数
function f1(a,b){
console.log('111');
}
f1(1,2);
//带返回值的函数
function f1(a,b){
return a+b;
}
f1(1,2); -- 3
//返回值不能有多个
function f1(a,b){
return a,b;
}
f1(1,2); -- 2
function f1(a,b){
return [a,b]; //想要多个返回值,需要换一种数据类型
}
f1(1,2); -- [1, 2]
//匿名函数:
var f1 = function(){
console.log('111');
}
f1();
//自执行函数
(function(a,b){
console.log(a+b);
})(1,2);函数的全局变量和局部变量
/*
局部变量：
在JavaScript函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它（该变量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除。
全局变量：
在函数外声明的变量是*全局*变量，网页上的所有脚本和函数都能访问它。
变量生存周期：
JavaScript变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。*/作用域
//首先在函数内部查找变量，找不到则到外层函数查找，逐步找到最外层。
var city = "BeiJing";
function f() {
var city = "ShangHai";
function inner(){
var city = "ShenZhen";
console.log(city);
}
inner();
}
f();
var city = "BeiJing";
function Bar() {
console.log(city);
}
function f() {
var city = "ShangHai";
return Bar;
}
var ret = f();
ret();
//闭包:
var city = "BeiJing";
function f(){
var city = "ShangHai";
function inner(){
console.log(city);
}
return inner;
}
var ret = f();
ret();面向对象
function Person(name){
this.name = name;
};
var p = new Person('taibai');
console.log(p.name);
Person.prototype.sum = function(a,b){ //封装方法
return a+b;
};
p.sum(1,2);
3date对象
//方法1：不指定参数
var d1 = new Date(); //获取当前时间
console.log(d1.toLocaleString()); //当前2时间日期的字符串表示
//方法2：参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString())
常用方法
var d = new Date();
使用 d.getDate()
//getDate() 获取日
//getDay () 获取星期 ，数字表示（0-6），周日数字是0
//getMonth () 获取月（0-11,0表示1月,依次类推）
//getFullYear () 获取完整年份
//getHours () 获取小时
//getMinutes () 获取分钟
//getSeconds () 获取秒
//getMilliseconds () 获取毫秒
//getTime () 返回累计毫秒数(从1970/1/1午夜),时间戳JSON对象
var a = {'name':'太白','age':89};
/*序列化:*/var b = JSON.stringify(a);
/*反序列化:*/var c = JSON.parse(b);RegExp对象
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");
// 简写方式
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;
/*
坑:
reg2.test(); 什么也不填写,会默认成reg2.test('undefined');
如果'undefined'满足你的正则要求,就返回true
*/
//字符串使用正则是的一些方法
var s2 = "hello world";
s2.match(/o/); //匹配元素
s2.match(/o/g); //加上g是全局匹配
s2.search(/o/); //找符合正则规则的字符串的索引位置
s2.split(/o/); //用符合正则的字符串进行分割
var s3 = 'Alex is A xiaosb';
s3.replace(/a/gi,'DSB'); // 替换,g全局替换,i不区分大小写
//正则加g之后,进行test测试需要注意的问题
var reg3 = /a/g;
var s1 = 'alex is a xiaosb';
reg3.lastIndex -- 0
reg3.test(s1); -- true
reg3.lastIndex -- 1
reg3.test(s1); -- true
reg3.lastIndex -- 9
reg3.test(s1); -- true
reg3.lastIndex -- 13
reg3.test(s1); -- false
//置零:
reg3.lastIndex = 0Math对象
Math.abs(x) //返回数的绝对值。
exp(x) //返回 e 的指数。
floor(x) //小数部分进行直接舍去。
log(x) //返回数的自然对数（底为e）。
max(x,y) //返回 x 和 y 中的最高值。
min(x,y) //返回 x 和 y 中的最低值。
pow(x,y) //返回 x 的 y 次幂。
random() //返回 0 ~ 1 之间的随机数。
round(x) //把数四舍五入为最接近的整数。
sin(x) //返回数的正弦。
sqrt(x) //返回数的平方根。
tan(x) //返回角的正切。