序言:

  1、JS和python一样,是秉持“一切皆对象原则”的相面对象的语言。

  2、JS和python一样,是动态型语言:一个变量名开始被赋值某数据类型后,后面可以动态更改,而非动态型语言,变量名初次赋值后类型则不可再更改。

一、数值类型---number:

  1、在JS中,整数和小数统一归为number类型:

var a = 1;
typeof a;  
// ===> "number"

var b = 1.1;
typeof b;
// ===> "number"

  2、类型转换:整数和小数有所区别。

var a = '1';
parseInt(a);
// ===> 1

var b = '1.1';
parseFloat(b);
// ===> 1.1

  3、类型转换只匹配开头:只要开头捕捉到整数或者小数就能完成转换,并且只截取捕捉到的开头部分。

var a = '1aaa';
parseInt(a);
// ===> 1

var b = '1.1';
parseInt(a);
// ===> 1

var c = 1.1;
parseInt(c);
// ===> 1

var d = '1.1aaa';
parseFloat(d);
// ===> 1.1

var e = 'a1';
parseInt(e);
// ===> NaN  // NaN 代表这是一个无法转换成数值类型的字符串类型

var f = 'a1.1';
parseFloat(f);
// ===> NaN

  4、自加运算:

var a = 1;
var x = a++;  // 先赋值再自加1
x;
// ===> 1
a;
// ===> 2
var b = 1;
var y = ++b;  // 先自加1再赋值
y;
// ===> 2
b;
// ===> 2

  5、比较运算:

var x = 1;
var y = '1';
x == y;  // 软等式,字符串和数值比较时会自动转换
// ===> true
x != y;
// ===> false
x === y;  // 硬等式,不会自动转换
// ===> false
x !== y;
// ===> true

  6、赋值运算:=,+=,-=,*=,之类的,同python

二、字符串类型---string:

  1、与python一样,单引号和双引号都可以:

var a = 'aaa';
typeof(a);
// ===> "string"

var b = "aaa";
typeof(b);
// ===> "string"

  2、模板字符串:可以多行书写,并且可以格式化字符串。

var a = `
aaa
bbb
ccc
`;
typeof(a);
// ===> "string"

var name = 'tom';
var age = 18;
var introduce = `he name is ${name} and age is ${age}`;
typeof introduce;
// ===> "string"
introduce;
// ===> "he name is tom and age is 18"

  3、字符串拼接:JS中推荐直接用+号。

var a = 'aaa';
var b = '111';
var c = a + b;
typeof c;
// ===> "string"
c;
// ===> "aaa111"

三、字符串类型的常用方法:

  1、获取字符串的长度属性:

var a = 'abcdef';
var l = a.length;
l;
// ===> 6

  2、获取移除结果:

var a = '   abc   ';
var x = a.trim();  // 获取字符串移除两侧空白后的结果
x;
// ===> "abc"
var y = a.trimLeft();  // 获取字符串只移除左侧空白后的结果
y;
// ===> "abc   "
var z = a.trimRight();  // 获取字符串只移除右侧空白后的结果
z;
// ===> "   abc"
// 只能移除空白,不可以指定移除符

  3、按索引获取字符:

var a = 'abcdef';
var x = a.charAt(3);
x;
// ===> "d"
var y = a[3]; // 也可以直接按索引取值,不支持负索引号 y; // ===> "d"

  4、获取某个字符在字符串中的位置:

var a = 'abcdef';
var n = a.indexOf('d');
n;
// ===> 3
var n2 = a.indexOf('de');
n2;
// ===> 3  // 即使用多个字符去匹配,也只以首个字符为准

  5、截取字符串中的部分字符:

var a = 'abcdef';
var x = a.substring(1,5);  // 1号索引开始,4号索引结束
x;
// ===> "bcde"
var y = a.slice(1,5);  // 与substring效果一致
y;
// ===> "bcde"
var z = a.slice(2,-2);  // 2号索引开始,-3号索引结束,而string无法用负号索引
z;
// ===> "cd"

  6、获取转大小后的结果:

var a = 'aBcDe';
var x = a.toLowerCase();
x;
// ===> "abcde"
var y = a.toUpperCase();
y;
// ===> "ABCDE"

  7、以某个字符为隔断,对字符串进行分组,获取分组后的数组:

var a = 'aaa+bbb+ccc+ddd+eee+fff';
var x = a.split('+');
x;
// ==> (6) ["aaa", "bbb", "ccc", "ddd", "eee", "fff"]
var y = a.split('+', 3);  // 可以指定只获取分组后的前几个元素组成的数组
y;
// ===> (3) ["aaa", "bbb", "ccc"]

  8、获取其他字符串拼接进来后组成的新字符串:

var a = 'adc';
var b = 'def';
var x = a.concat(b);
x;
// ===> "adcdef"
var c = 111;  // 若用于拼接的不是字符串类型,会自动转成字符串类型再拼接,用+号的方式同理
var y = a.concat(c);
y;
// ===> "adc111"

四、布尔类型---boolean:

  1、python中True/False ===> JS中true/false

var a = (2 > 1);
a;
// ===> true
typeof a;
// ===> "boolean"
var b = (2 < 1);
b;
// ===> false
typeof b;
// ===> "boolean"

  2、隐式布尔值:空数据,0,null,underfined,NaN的隐式布尔值是false,其余的都是true

  3、null与underfined:

    ①null代表值为空:一般用于新建一个空数据,或者清空一个非空数据。

var a = null;
var b = 'abc';
var b = null;

    ②undefined:

      a:定义了一个变量,但是没有赋值。

var a;
a;
// ===> undefined

      b:没有定义返回值的函数默认的返回值也是undefined

  4、逻辑运算:&&,||,!---与,或,非,适用短路原则。

var a = 1;
var b = 2;
var c = 0;
a && b; 
// ===> 2
c && a;
// ===> 0
a || b;
// ===> 1
c || a;
// ===> 1
!a;
// ===> false
!c;
// ===> true

五、数组:类似于python中的列表。

var l = [1, 1.1, 'aaa', true];
typeof l;
// ===> "object"  // JS中,数组以及其他一些类型统属于object类型
l[2];  // 按索引取值,不支持负索引号
// ===> "aaa"
var ll = [l, 'bbb'];  // 可以数组中嵌套数组
ll;
// ===> (2) [Array(4), "bbb"]
typeof ll;
// ===> "object"

六、数组的常用方法:

  1、数组的长度属性:

var a = [1, 2, 3];
var l = a.length;
l;
// ===> 3

  2、尾部添加元素:

var a = [1, 2, 3];
var b = 'aaa';
a.push(b);
a;
// ===> (4) [1, 2, 3, "aaa"]

  3、移出尾部元素:

var a = [1, 2, 3];
var x = a.pop();
x;
// ===> 3
a;
// ===> (2) [1, 2]

  4、头部添加元素:

var a = [1, 2, 3];
var b = 'aaa';
a.unshift(b);
a;
// ===> (4) ["aaa", 1, 2, 3]

  5、移出头部元素:

var a = [1, 2, 3];
var x = a.shift();
x;
// ===> 1
a;
// ===> (2) [2, 3]

  6、截取数组的部分元素组成新数组:机理类似于字符串的方法。

var a = [1, 2, 3, 4, 5, 6];
var x = a.slice(1,5);
x;
// ===> (4) [2, 3, 4, 5]
var y = a.slice(2,-2);
y;
// ===> (2) [3, 4]

  7、获取反序数组:

var a = [2, 3, 1];
var x = a.reverse();
x;
// ===> (3) [1, 3, 2]

  8、将指定字符串插入数组每个元素之间,获取组成的字符串:

var a = ['a', 123, 'b'];  // 数值会被转化为字符串处理
var x = a.join('+');  // 此处语法与python正好相反---'+'.join(a)
x;
// ===> "a+123+b"

  9、将其他数组加入尾部,获取组合数组:

var a = [1, 2, 3];
var b = ['aaa', 'bbb', 'ccc'];
var x = a.concat(b);
x;
// ===> (6) [1, 2, 3, "aaa", "bbb", "ccc"]

  10、排序数组:

var a = [2, 3, 1];
a.sort();
a;
// ===> (3) [1, 2, 3]

   11、forEach遍历:分别依次取出数组中每个元素的值/索引/源数组放入函数中执行,有,只拿值,拿值/索引,拿值/索引/源数组,这三种用法。

var a = ['aaa', 'bbb', 'ccc'];
a.forEach(
function(value){console.log(value)}); // ==> aaa bbb ccc a.forEach(function(value, index){console.log(value, index)}); // ===> aaa 0 bbb 1 ccc 2 a.forEach(function(value, index, arr){console.log(value, index, arr)}); // ===> aaa 0 (3) ["aaa", "bbb", "ccc"] bbb 1 (3) ["aaa", "bbb", "ccc"] ccc 2 (3) ["aaa", "bbb", "ccc"]

  12、map遍历:取出数组每个元素放入函数中执行,将所有返回值组成新数组。

var a = ['aaa', 'bbb', 'ccc'];
var x = a.map(function(value){return value + 'sss'});
x;
// ===> (3) ["aaasss", "bbbsss", "cccsss"]

  13、移花接木:

var a = [1, 2, 3, 4, 5, 6];
var x = a.splice(1, 4);  // 移出数组某部分元素,这里是1号索引到4号索引
x;
// ===> (4) [2, 3, 4, 5]
a;
// ===> (2) [1, 6]
var b = [1, 2, 3, 4, 5, 6];
var c = 'aaa';
var y = b.splice(1, 4, c);  // 移出数组某部分元素,并在移出的位置补上元素
y;
// ===> (4) [2, 3, 4, 5]
b;
// ===> (3) [1, "aaa", 6]

 七、流程控制:

  1、if判断:

var a = 15;
if (a < 10){
console.log('触发事件1')
}
else if (a < 20){
console.log('触发事件2')
}
else {
console.log('触发事件3')
};
// ===> 触发事件2

  2、switch选择:预先将条件与执行代码配对。

var a = 2;
switch(a){
    case(1):
        console.log('触发事件1')
        break;  // 若不加break,则满足条件后会继续执行后续代码
    case(2):
        console.log('触发事件2')
        break;
    case(3):
        console.log('触发事件3')
        break;
    default:
        console.log('所有预备条件都未满足,则触发本事件')
};
// ===> 触发事件2

  3、for循环:

for(var n = 1; n < 4; n++){
console.log(n)
};
// ===> 
1
2
3

  4、while循环:

var a = 1;
while (a < 4){
console.log(a)
a++
};
// ===>
1
2
3

  5、三元表达式:

var res1 = 2 > 1?'真聪明':'继续努力';
res1;
"真聪明"
var res2 = 1 === 2?'真聪明':'继续努力';
res2;
"继续努力"

八、函数

  1、基本格式:function 函数名(形参1,形参2,...(可无参)){函数体代码}

  2、JS之奇:

    ①实参多传不会报错,多余的实参无效。

    ②实参少了也不会报错,未传值的形参等于传了undefined

  3、函数体内arguments数据:用于收取函数收到的所有参数。

function ShowInfo(name, age){
    var info = `my name is ${name} and my age is ${age}`;
    console.log(arguments);
    console.log(info)
};
ShowInfo('tom', 18);
// ===> Arguments(2) ["tom", 18, callee: ƒ, Symbol(Symbol.iterator): ƒ]
// ===> my name is tom and my age is 18

  4、也可以用关键字return设置返回值。

function func1(a, b, c){
  return a, b, c
};
var res1 = func1('111', '222', '333');
res1;
// ===> "333"  // 无法返回多个值,若声明多个,只会返回最后一个

  5、匿名函数:不给函数起名,若要使用该函数,需要用一个变量名接收一下。

var func = function(){
    console.log('a u ok?')
};
func();
// ===> a u ok?

  6、箭头函数:var 函数名 = 形参 => 返回值表达式。

var func = (a, b) => a*b;
var res = func(3, 5);
res;
// ===> 15

  7、名称空间作用域:与python查找顺序一致---由内而外。

九、自定义对象:可以看成python中的字典,比字典使用更方便。

  1、创建自定义对象的两种方式:

var a = {};
a;
// ===> {}
typeof a;
// ===> "object"
var b = new Object();
b;
// ===> {}
typeof b;
// ===> "object"

  2、自定义对象添加元素和查找元素的方式:

var a = {};
a['name'] = 'tom';
a.age = 18;
a;
// ===> {name: "tom", age: 18}
a['name'];
// ===> "tom"
a.age;
// ===> 18

十、日期对象

  1、创建日期对象的三种方式:

var a = new Date();
a;
// ===> Mon May 18 2020 13:35:12 GMT+0800 (中国标准时间)  // 获取当前时间,初始格式
a.toLocaleString();
// ===> "2020/5/18 下午1:35:12"  // 转化为易查看格式
var b = new Date('1998/3/3 12:34:56');
b;
// ===> Tue Mar 03 1998 12:34:56 GMT+0800 (中国标准时间)
b.toLocaleString();
// ===> "1998/3/3 下午12:34:56"
var c = new Date(2008, 10, 15, 12, 34, 56);  // 此法创建日期输入的月份比实际小1
c;
// ===> Sat Nov 15 2008 12:34:56 GMT+0800 (中国标准时间)
c.toLocaleString();
// ===> "2008/11/15 下午12:34:56"

  2、时间对象的常用方法:

var a = new Date();
a.toLocaleString();
// ===> "2020/5/18 下午1:45:22"
a.getDate();  // 日期号
// ===> 18
a.getDay();  // 星期号
// ===> 1
a.getMonth();  // 月份-1
// ===> 4
a.getFullYear();  // 年号
// ===> 2020
a.getHours();  // 小时
// ===> 13
a.getMinutes();  // 分钟
// ===> 45
a.getSeconds();  // 秒数    
// ===> 22
a.getMilliseconds();  // 毫秒
// ===> 299
a.getTime();  // 时间戳    
// ===> 1589780722299

十一、JSON对象:

var a = {'name':'tom', 'age':18};
var b = JSON.stringify(a);  // 序列化
b;
// ===> "{"name":"tom","age":18}"
typeof b;
// ===> "string"
var c = JSON.parse(b);  // 反序列
c;
// ===> {name: "tom", age: 18}

十二、正则对象

  1、创建正则对象的两种方式:

var a = new RegExp('^[a-zA-Z][a-zA-Z0-9]{1,3}');
a;
// ===> /^[a-zA-Z][a-zA-Z0-9]{1,3}/
var b = /^[a-zA-Z][a-zA-Z0-9]{1,3}/;
b;
// ===> /^[a-zA-Z][a-zA-Z0-9]{1,3}/

  2、正则对象的常用方法

var a = /^[a-zA-Z][a-zA-Z0-9]{1,3}/;
a.test('a123');
// ===> true

  3、正则对象的几个注意点:

    ①全局匹配模式下有一个lastIndex属性,会导致多次匹配结果不同。

    ②匹配内容为空的时候,会把“undefined”作为内容匹配。

十三、数学对象

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)      返回角的正切。

 

posted on 2020-05-13 02:01  焚音留香  阅读(168)  评论(0编辑  收藏  举报