python 之 前端开发（ JavaScript变量、数据类型、内置对象、运算符、流程控制、函数）

// 1. 先声明后定义
var name; // 声明变量时无需指定类型，变量name可以接受任意类型
name= "egon";
?
// 2. 声明立刻定义
var age = 18;

abstract、boolean、byte、char、class、const、debugger、double、enum、export、extends、final、float、goto
implements、import、int、interface、long、native、package、private、protected、public、short、static、super、synchronized、throws、transient、volatile

for(let i=1;i<=5;i++){
    console.log(i);
}                       //1 2 3 4 5

const PI = 3.1415926;
PI=3                    //TypeError: "PI" is read-only

var x = 3;
var y = 3.1;
var z = 13e5;
var m = 13e-5;
var n = NaN;                    // typeof n结果"number"
//四舍五入
var num=1.3456
num.toFixed(2)                  // "1.35"
?
//字符串类型转成数字
parseInt("123")                // 返回123
parseInt("ABC")                // 返回NaN  NaN属性是代表非数字值的特殊值,该属性用于指示某个值不是数字。
console.log(parseInt("18林海峰")); //18  带有自动净化的功能；只保留字符串最开头的数字，后面的中文自动消失
console.log(parseInt("林海峰18")); // NaN  只去末尾的中文，不会去开头的
parseInt("123.456")             // 返回123  
parseFloat("123.456")           // 返回123.456    字符串中的数字转浮点
var a = parseInt("1.3") + parseInt("2.6"); //a=3    自动带有截断小数的功能：取整，不四舍五入
var a = parseFloat("1.3") + parseFloat("2.6"); //a=3.9
?
//数字类型转成字符串
var x=10;
var y=‘20‘;
var z=x+y; // z=‘1020‘
typeof z; //String
?
var m=123;
var n=String(m)//‘123‘
?
var a=123;
var b=a.toString()//‘123‘

var a = "Hello";
var b = "world";
var c = a + b; 
console.log(c);     // 得到Helloworld

substirng()的特点：
如果 start > stop ，start和stop将被交换
如果参数是负数或者不是数字，将会被0替换
?
silce()的特点：
如果 start > stop 不会交换两者
如果start小于0，则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0，则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)

1、完全可以当做普通字符串使用
var msg = `my name is egon`
2、也可以用来定义多行字符串
var info = `
    name:egon
    age:18
    sex:male
`
3、并且可以在字符串中嵌入变量
var name = "egon";
var age = 18;
var msg = `my name is ${name}, my age is ${age}`;       // "my name is egon, my age is 18"

var a = true;
var b = false;
//布尔值为false的数据类型
Boolean(‘‘)
Boolean(0)
Boolean(null)
Boolean(undefined)
Boolean(NaN)
?
//其余数据类型的布尔值均为true
Boolean([])
Boolean(123)

var x = ["egon", "hello"];
console.log(x[1]);           // 输出"hello"

function sortNumber(a,b){
    return a - b
}
var arr = [123,9,1211,11]
arr.sort(sortNumber)                    //[9, 11, 123, 1211]

var arr = [11, 22, 33, 44];
for (var i=0;i<arr.length;i++) {
  console.log(arr[i]);                
}                                   //11 22 33 44

var arr=[‘aa‘,‘bb‘,‘cc‘,‘dd‘,‘ee‘]
arr.forEach(function(v,i,arr){
    console.log(v,i,arr);
    console.log(this[0]);
},"hello")  
//aa 0  ["aa", "bb", "cc", "dd", "ee"] h
//bb 1  ["aa", "bb", "cc", "dd", "ee"] h
//cc 2  ["aa", "bb", "cc", "dd", "ee"] h
//dd 3  ["aa", "bb", "cc", "dd", "ee"] h
//ee 4  ["aa", "bb", "cc", "dd", "ee"] h

var arr=[‘aa‘,‘bb‘,‘cc‘,‘dd‘,‘ee‘]
arr.splice(1,3,‘xxxx‘)                  //删除‘bb’，‘cc’，’dd‘这三个值，然后插入’xxxx‘
arr                                   //["aa", "xxxx", "ee"]

//字符串反转
var str = ‘12345‘;
Array.prototype.map.call(str, function(x) {             //同时利用了call()方法
  return x;
}).reverse().join(‘‘);                                // "54321"

//方法1：不指定参数
var d1 = new Date();
console.log(d1.toLocaleString());       //  2020/8/9 下午8:24:06
?
//方法2：参数为日期字符串
var d2 = new Date("2018/01/27 11:12:13");
console.log(d2.toLocaleString());       //  2018/1/27 上午11:12:13
?
var d3 = new Date("01/27/18 11:12:13"); //  月/日/年 时分秒
console.log(d3.toLocaleString());       //  2018/1/27 上午11:12:13
?
//方法3：参数为毫秒数
var d4 = new Date(7000);
console.log(d4.toLocaleString());       //  1970/1/1 上午8:00:07
console.log(d4.toUTCString());          //  Thu, 01 Jan 1970 00:00:07 GMT
?
//方法4：参数为：年，月，日，时，分，秒，毫秒
var d5 = new Date(2018,1,27,11,12,13,700);
console.log(d5.toLocaleString());  //毫秒并不直接显示    //  2018/2/27 上午11:12:13

// 对象转成JSON字符串
var obj2={"name":"egon","age":18};
str2=JSON.stringify(obj2);                //  "{"name":"egon","age":18}"
?
// JSON格式的字符串转成对象
var str1=‘{"name":"egon","age":18}‘;
var obj1=JSON.parse(str1);
console.log(obj1.name);                  // ‘egon‘
console.log(obj1["name"]);               //  ‘egon‘

1. 创建正则对象的方式1
参数1 正则表达式
参数2 匹配模式：常用g(全局匹配;找到所有匹配，而不是在第一个匹配后停止)和i(忽略大小写)
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$"); //  匹配用户名只能是英文字母、数字和_
reg1.test("egon_123") // true            //首字母必须是英文字母,长度最短不能少于6位 最长不能超过12位。
注意：正则放到引号内，{}内的逗号后面不要加空格

2. 创建正则对象的方式2
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;         // 不要加引号
reg2.test("egon_123")                             // true

3. String对象与正则结合的4个方法
var s1="hello world";
s1.match(/l/g)                                 // 符合正则的内容["l", "l", "l"]
s1.search(/h/g)                             // 符合正则的内容的第一个索引0
s1.split(/ /)                                 // ["hello", "world"]，默认全部切割
s1.replace(/l/g,‘L‘)                          // "heLLo worLd"

4. 匹配模式g与i
var s2="name:Egon age:18"
s2.replace(/e/,"赢")                         // "nam赢:Egon age:18"
s2.replace(/e/g,"赢")                         // "nam赢:Egon ag赢:18"
s2.replace(/e/gi,"赢")                         //"nam赢:赢gon ag赢:18"

1、如果regExpObject带有全局标志g，test()函数不是从字符串的开头开始查找，而是从属性regExpObject.lastIndex所指定的索引处开始查找。
2、该属性值默认为0，所以第一次仍然是从字符串的开头查找。
3、当找到一个匹配时，test()函数会将regExpObject.lastIndex的值改为字符串中本次匹配内容的最后一个字符的下一个索引位置。
4、当再次执行test()函数时，将会从该索引位置处开始查找，从而找到下一个匹配。
5、因此，当我们使用test()函数执行了一次匹配之后，如果想要重新使用test()函数从头开始查找，则需要手动将regExpObject.lastIndex的值重置为 0。
6、如果test()函数再也找不到可以匹配的文本时，该函数会自动把regExpObject.lastIndex属性重置为 0。
var reg3 = /egon/g;
reg3.lastIndex
0
reg3.test("egon")    // true，匹配成功
true
reg3.lastIndex      // 匹配成功reg3.lasIndex=4
4
reg3.test("egon")   // 从4的位置开始匹配，本次匹配失败
false
reg3.lastIndex      // 匹配失败，lastIndex归为0
0
reg3.test("egon")   // 再次匹配成功
true

当我们不加参数调用RegExpObj.test()方法时, 相当于执行RegExpObj.test("undefined"), 且/undefined/.test()默认返回true。
var reg4 = /^undefined$/;
reg4.test();                // 返回true
reg4.test(undefined);        // 返回true
reg4.test("undefined");      // 返回true

//算数运算符:
+ - * / % ++ --
//比较运算符:
> >=  < <=  !=  ==  ===  !==
//逻辑运算符
&& || !
//赋值运算符
=  +=  -=  *=  /=    

var age=18;
if(age > 18){
    console.log(‘too old‘);
}
else if(age == 18){
    console.log(‘花姑娘,吆西‘);
}
else {
    console.log(‘too young‘);
}                                   // 花姑娘,吆西

var day = new Date().getDay();
switch (day) {
  case 0:
      console.log("星期天，出去浪");
      break;
  case 6:
      console.log("星期六，也出去浪");
      break;
  default:
      console.log("工作日，正常上班")
}                                       //工作日，正常上班

let i=0;
undefined
while (i<=3){
    console.log(i);
    i++;
} 

var x=1;
var y=2;
var z=x>y?x:y       // 2

// 无参函数
function f1() {
  console.log("Hello world!");
};
f1();
?
// 有参数函数
function f2(a, b) {
  console.log(arguments);               // 内置的arguments对象
  console.log(arguments.length);
  console.log(arguments[0],arguments[1]);
  console.log(a, b);
};
f2(10,20);
?
// 带返回值的函数
function sum(a, b){
  return a + b;
}
sum(1, 2); 
?
// 匿名函数
var sum = function(a, b){
  return a + b;
}
sum(1, 2);
?
// 立即执行函数
(function(a, b){
  return a + b;
})(1, 2);