前端之JavaScript

最新推荐文章于 2024-08-15 08:55:57 发布

aimu4909

最新推荐文章于 2024-08-15 08:55:57 发布

阅读量68

点赞数

文章标签： javascript 前端 python ViewUI

原文链接：http://www.cnblogs.com/Treelight/p/11252211.html

版权

总体概述

JavaScript其实也是一种语言，它可以使得页面动起来。JavaScript与python一样，也是需要解释器的。但其解释器不需要特别安装，因为浏览器就是JavaScript的解释器！！

存在形式

一、存在于一个head标签中

二、存在于body标签的最低部，不建议在body标签的其它地方，因为html也是从上到下执行，在body标签的其它地方则有可能会卡住

三、存在于文件中<script src='path'></script>

注释

与c类似，//单行注释，

/* ... */多行注释

变量

1、局部变量：var name='Treelight'

2、全局变量：name='Treelight'

数据类型

一、数值型

不分整型和浮点型

字符串转换成整型：parseInt

a="18"

parseInt(a)

二、字符串型

a='Treelight'

bj.trim() 移除空白

obj.trimLeft()

obj.trimRight)

obj.charAt(n) 返回字符串中的第n个字符

obj.concat(value, ...) 拼接

obj.indexOf(substring,start) 子序列位置

obj.lastIndexOf(substring,start) 子序列位置

obj.substring( from , to) 根据索引获取子序列

obj. slice (start, end) 切片

obj.toLowerCase() 大写

obj.toUpperCase() 小写

obj.split(delimiter, limit) 分割

obj.search(regexp)                   从头开始匹配，返回匹配成功的第一个位置(g无效)

obj.match(regexp)                    全局搜索，如果正则中有g表示找到全部，否则只找到第一个。

obj.replace(regexp, replacement) 替换，正则中有g则替换所有，否则只替换第一个匹配项，

$数字：匹配的第n个组内容；

$&：当前匹配的内容；

$`：位于匹配子串左侧的文本；

$'：位于匹配子串右侧的文本

$$：直接量$符号

三、setInterval(func,time)：定时器

实例：跑马灯

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="i1">欢迎各位领导莅临指导工作</div>
<script>
    function raceLamp(){
        //根据id获取标签
        var tag = document.getElementById('i1');
        //获取标签的内容
        var t = tag.innerText;
        //获取首字符
        f = t.charAt(0);
        //获取其它字符
        rest = t.substring(1,t.length);
        new_str = rest + f;
        tag.innerText = new_str
    }
    setInterval('raceLamp()', 500)
</script>
</body>
</html>

四、布尔类型

1、小写：true false

五、数组（和python列表类似）

l=[11,22,33,44]

1、l.length

2、l.push(ele)：追加元素

3、l.pop()：获取尾部一个值，并且删除

4、l.unshift(ele)：头部添加一个值

5、l.shift()：头部移除一个值，并返回此值

6、l.splice(start,deletecount,value....)：

l.splice(1,1,value)：替换位置为1的元素

l.splice(1,0,value)：在位置1添加元素

l.splice(1,1)：删除位置为1的元素

7、l.slice(start,end)：切片

8、l.reverse()：反转

9、l.join(sep)：用sep连接起来　　

10、l.concat(val1...)：拼接

11、l.sort()：排序

六、字典（与python一样）

七、for循环

1、

l=[11,22,33,44];

for (var item in l]{

　　consolie.log(item)

item的值为索引，也可循环字典

2、

for (var i=0;i<4;i++){

}

八、条件语句

if(条件){

}else if(条件){

}else if(条件){

}else{

}

switch：

switch(name){

　　case 'treelight':

　　　　age=37;

　　　　break;

　　case 'alex':

　　　　age=41;

　　　　break;

　　default:

　　　　age=20;

}

== 值相等
=== 值和类型都相等
&& and
|| or

九、函数定义

1、普通函数

function 函数名(a,b,c){

}

函数名(1,2,3)

2、匿名函数

如下，function没有函数名：

setInterval(function (){

　　console.log(123);

　　},5000)

3、创建函数，并自动执行

如下：一创建就执行，外面的1是实参。

(function(arg){

　　console.log(arg)

})(1)

词法分析

十、序列化

li=[11,22,33,44]

1、l = JSON.stringify(li)　　对象转换成字符串

2、newli=JSON.parse(l) 字符串转换成对象

十一、转义（解码）

url="https://www.sogou.com/web?query=微软"

1、encodeURI：对url中的字符转义，如：newurl=encodeURI(url)

2、decodeURI：解码

3、decodeURIComponent( ) URI组件中的未转义字符（我理解的就是非英文字符）

4、encodeURIComponent( ) 转义URI组件中的字符（非英文）

5、escape( ) 对字符串转义

6、unescape( ) 给转义字符串解码

7、URIError 由URl的编码和解码方法抛出

十二、eval

用法：eval(arg)：arg为字符串，可为表达式或代码段。

十三、时间

用法如下：

d = new Date()　　# 获取当前时间

d.getXXX　　# 获取当前时间

d.setXXX　　# 设置

十四、作用域

1、以函数作为作用域

2、函数的作用域在函数未调用之前，已经创建

3、函数的作用域存在作用塸链，并且也是在函数未调用之前已经创建。函数找变量时也是从里往外走

4、函数内局部变量会提前声明，如果没提前声明而使用，则值为undefined。

十五、面向对象（其实是函数的变种）

例子如下：

function foo(n){

　　this.name=n

　　this.sayname=function(){

　　　　console.log(this.name);

　　}

1、在以上例子中，this相当于python中的self

2、创建对象需加关键字new----->如obj = new foo('alex')

但以上定义会出现问题，sayname的函数是一个公共的函数，但每创建一个类就会又创建一个sayname的函数，造成内存空间的浪费。

解决办法：利用原型定义公用函数

foo.prototype={

　　'sayName':function(){

　　　　console.log(this.name)

　　}

调用方法：obj.sayName()

正则表达式

前导

创建正则表达式的方法：

/.../ 用于定义正则表达式
/.../g 表示全局匹配
/.../i 表示不区分大小写
/.../m 表示多行匹配

一、test：检测是否符合正则表达式的规则

如：pattern = /\d+/

text='Syvia22'

pattern.test(text);

二、exec：获取匹配的字符，默认情况下只会匹配第一个

非全局模式

获取匹配结果数组，注意：第一个元素是第一个匹配的结果，后面元素是正则子匹配（正则内容分组匹配）

var pattern = /\bJava\w*\b/;

var text = "JavaScript is more fun than Java or JavaBeans!" ;

result = pattern.exec(text)

var pattern = /\b(Java)\w*\b/;

var text = "JavaScript is more fun than Java or JavaBeans!" ;

result = pattern.exec(text)

全局模式

需要反复调用exec方法，来一个一个获取结果，直到匹配获取结果为 null 表示获取完毕

var pattern = /\bJava\w*\b/g;

var text = "JavaScript is more fun than Java or JavaBeans!" ;

result = pattern.exec(text)

var pattern = /\b(Java)\w*\b/g;

var text = "JavaScript is more fun than Java or JavaBeans!" ;

result = pattern.exec(text)

多行模式

var pattern = /^Java\w*/gm;

var text = "JavaScript is more fun than \nJavaEE or JavaBeans!" ;

result = pattern.exec(text)

转载于:https://www.cnblogs.com/Treelight/p/11252211.html

aimu4909

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端之JavaScript

总体概述JavaScript其实也是一种语言，它可以使得页面动起来。JavaScript与python一样，也是需要解释器的。但其解释器不需要特别安装，因为浏览器就是JavaScript的解释器！！存在形式一、存在于一个head标签中二、存在于body标签的最低部，不建议在body标签的其它地方，因为html也是从上到下执行，在body标签的其它地方则有可能会卡住三 ...
复制链接

扫一扫