1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > python 之 前端开发( JavaScript变量 数据类型 内置对象 运算符 流程控制 函数)...

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

时间:2023-07-20 14:14:50

相关推荐

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

11.4 JavaScript

11.41 变量

1、声明变量的语法

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

2、变量名命名规范

1、由字母、数字、下划线、$ 组成,但是不能数字开头,也不能纯数字

2、严格区分大小写

3、不能包含关键字和保留字(以后升级版本要用的关键字)。

如:

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

4、推荐驼峰命名法:有多个有意义的单词组成名称的时候,第一个单词的首字母小写,其余的单词首字母写

5、匈牙利命名:就是根据数据类型单词的的首字符作为前缀

3、ES6中let

ES6之前js没有块级作用域,ES6新增了let命令,用于声明变量(声明的变量属于块级作用域),流程控制语句的{}就是块级作用域。其用法类似于var,但是所声明的变量只在let命令所在的代码块内有效。例如:for循环的计数器就很适合使用let命令

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

4、常量

ES6新增const用来声明常量。一旦声明,其值就不能改变。

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

11.42 数据类型

11.421 数值(Number)

JavaScript不区分整型和浮点型,就只有一种数字类型,即number

var x = 3;var y = 3.1;var z = 13e5;var m = 13e-5;var n = NaN;// typeof n结果"number"//四舍五入var num=1.3456num.toFixed(2) // "1.35"​//字符串类型转成数字parseInt("123")// 返回123parseInt("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'

11.422 字符串(String)

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

常用方法:

substirng()与silce()的区别:

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

补充:

ES6中引入了模板字符串:模板字符串(template string)是增强版的字符串,用反引号(`)标识,它的用途为

1、完全可以当做普通字符串使用var msg = `my name is egon`2、也可以用来定义多行字符串var info = `name:egonage:18sex: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"

注意:

如果模板字符串中需要使用反引号,则在其前面要用反斜杠转义

11.423 布尔值

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

null 和 undefined :

null:表示值是空,一般在需要指定或清空一个变量时才会使用,如 name=null;undefined:表示当声明一个变量但未初始化时,该变量的默认值是undefined。还有就是函数无明确的返回值时,返回的也是undefined。 null表示变量的值是空,undefined则表示只声明了变量,但还没有赋值。

11.43 内置对象

11.431 数组对象Array

数组对象的作用是:使用单独的变量名来存储一系列的值。类似于Python中的列表。

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

常用方法:

提供比较函数进行排序,该函数应该具有两个参数 a 和 b,接收传入的a和b,执行函数体代码,然后返回一个值用于说明a和b的大小

返回值 < 0 :代表a小于b

返回值 =0 : 代表a等于b

返回值 > 0 :代表a大于b

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

forEach() :

语法:forEach( function ( 当前元素, 当前元素索引, 当前元素所属数组arr), thisValue)

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

splice() :

语法:splice ( 起始元素索引 , 删除的个数, 添加的新元素)

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

map() :

语法:map(function ( 当前元素, 当前元素索引, 当前元素所属数组arr), thisValue)

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

11.432 Date日期对象

创建日期对象只有构造函数一种方式,使用new关键字

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

常用方法:

编写代码,将当前日期按“-12-27 11:11 星期三”格式输出:

const WEEKMAP = {0: "星期日",1: "星期一",2: "星期二",3: "星期三",4: "星期四",5: "星期五",6: "星期六",};​function showTime() {var d1 = new Date();var year = d1.getFullYear();var month = d1.getMonth() + 1;var day = d1.getDate();var hour = d1.getHours();var minute = d1.getMinutes() < 10 ? "0"+d1.getMinutes() :d1.getMinutes();var week = WEEKMAP[d1.getDay()]; // 0~6的星期var dateStr = `${year}-${month}-${day} ${hour}:${minute} ${week}`;console.log(dateStr)}​showTime();// -8-9 20:37 星期五

View Code

11.433 Math对象
11.434 JSON对象

// 对象转成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'

11.435 RegExp对象

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. 创建正则对象的方式2var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/; // 不要加引号reg2.test("egon_123") // true3. String对象与正则结合的4个方法var s1="hello world";s1.match(/l/g) // 符合正则的内容["l", "l", "l"]s1.search(/h/g) // 符合正则的内容的第一个索引0s1.split(/ /) // ["hello", "world"],默认全部切割s1.replace(/l/g,'L')// "heLLo worLd"4. 匹配模式g与ivar 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"

5.注意1:

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.lastIndex0reg3.test("egon") // true,匹配成功truereg3.lastIndex// 匹配成功reg3.lasIndex=44reg3.test("egon") // 从4的位置开始匹配,本次匹配失败falsereg3.lastIndex// 匹配失败,lastIndex归为00reg3.test("egon") // 再次匹配成功true

6.注意2:

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

11.44 运算符

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

11.45 流程控制

if...else :

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

switch :

switch中的case子句通常都会加break语句,否则程序会继续执行后续case中的语句

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

while:

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

三元运算:

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

11.46 函数

1、函数的定义与调用(与python类同)

// 无参函数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);

注意:

函数只能返回一个值,如果要返回多个值,只能将其放在数组或对象中返回

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。