python基础6-web之js

历史
javascript 1995年，网景 Brendan Eich 10天设计出
微软模仿开发了JScript
为了成为全球标准，几个公司联合下面
组织ECMA（European Computer Manufacturers Association）
欧洲计算机制造联盟
定制ECMAScript标准
ES6 ：2015年6月正式发布

javascript独立的语言，浏览器有js的解释器

1.JavaScript代码存在形式：
　　1)head中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        alert(larlly);
    </script>
</head>
<body>
</body>
</html>

View Code

　　2)文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jss_file</title>
    <script src="js1.js"></script>
</head>
<body>
</body>
</html>

View Code

alert('larlly');

var x=1;
var a = "hello,world";
var y=1;var z=2;//不建议一行写多条语句
if(2>1){
    x=1;
    y=2;
    z=3;
    if(x<y){
        z=4;
    }
    if(x>y){
        z=5;
    }
}
alert(
    'hello'
);

View Code

　　ps；js代码需要放置在<body>标签内部的最下方

　　3)变量

python:
name = 'larlly'
javascript:
name = "larlly"    #全局变量
var name = "larlly"	#局部变量
写js代码：
html文件中编写
临时，浏览器的console,右击点击审查元素，打开console
parseInt(12/5)  转换数据类型为整数
parseFloat(12/5)	转换数据类型为浮点型

　　4)定时器：

console.log(n) ; //会在console里打印日志n，

　　　　a）每隔2秒弹窗

<script>
    setInterval("alert(larlly);",2000);  //前边是执行的代码，2000是间隔时间，单位毫秒
</script>

　　　　b）“迎新年，庆新年，2018万岁”

<div>
    <h1 id="i1">迎新年，庆新年，2018万岁</h1>
</div>
<script>
　　//写一个函数，定时器调用
    function func(){
    //根据ID获取指定标签的内容，定于局部变量接受
    var tag = document.getElementById('i1');
    //获取标签内部的内容
    var content = tag.innerText;
    var f = content.charAt(0);
    var l = content.substring(1,content.length);
    var new_content = l + f;
    tag.innerText = new_content;
     }
    setInterval('func()', 500);
</script>

　　　　c)根据输入数据进行弹窗

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>根据输入数据弹窗</title>
</head>
<body>
    <input type="text" id="user">
    <input type="button" onclick="GetData();" value="点我"/>
    <script>
        function GetData() {
            var i = document.getElementById('user');
            alert(i.value);
        }
</script>
</body>
</html>

2.注释

　　注释
　　单行注释 //
　　多行注释 /* */

3.字符串（String）

字符串是由字符组成的数组，但在JavaScript中字符串是不可变的：可以访问字符串任意位置的文本，但是JavaScript并未提供修改已知字符串内容的方法。

常见功能：

obj.length    						//长度
 
obj.trim()      					//移除空白
obj.trimLeft()
obj.trimRight()
obj.charAt(n)       				//返回字符串中第n个字符
obj.concat(value,...)  		 		//拼接
obj.indexOf('substring',start)  	//子序列位置,substring是子序列，start是从哪个索引开始找，若无则返回-1
obj.lastIndexOf('substring',start)  //子序列位置,自右往左找，start指定开始位置，然后自右往左；
obj.substring(from,to)      		//根据索引获取子序列
obj.slice(start,end)        		//切片
obj.toLowerCase()       			//  小写
obj.toUpperCase()           		//大写
obj.split(delimiter,limit)      	//分割，delimiter指定分隔符，limit指定返回的前几个
 
obj.search(regexp)      			//从头开始匹配，返回匹配成功的第一个位置（g无效）
obj.match(RegExp)       			//全局搜索，如果正则中有g表示找到全部，否则只找到第一个
obj.replace(regexp,replacement)     //替换，正则中有g则替换所有，否则只替换第一个匹配项，

                                    $数字:匹配的第n个组内容；
                                    $&:当前匹配的内容；
                                    $`:位于匹配字符串左侧的文本；
                                    $':位于匹配字符串右侧的文本；
                                    $$:直接量$符号

4.数组

JavaScript中的数组类似于Python中的列表

常见功能：

obj.length                                  //数组的大小

obj.push(ele)                               //尾部追加元素
obj.pop()                                   //尾部获取一个元素在屏幕输出，并在该数组中清除
obj.unshift('ele')                          //头部插入元素
obj.shift()                                 //头部移除元素
obj.splice(start, deleteCount, value, ...)  // 插入、删除或替换数组的元素
                    obj.splice(n,0,val)     //指定位置插入元素
                    obj.splice(n,1,val)     //指定位置替换元素
                    obj.splice(n,1)         //指定位置删除元素
obj.slice(start,end)                        // 切片
obj.reverse( )                              //反转
obj.join('sep')                             //将数组元素连接起来以构建一个字符串,separator分隔符，即拼接符，在python中join是字符串的方法
obj.concat(val,..)                          //连接数组，只是临时，val并不会保存到该数组
obj.sort( )                                 //对数组元素进行排序

5.字典

与python无异

6.循环

其一：

var a = [11,22,33,44];
for (var item in a) {
    console.log(a[item]);
}
var b = {'k1':'v1','k2':'v2','k3':'v3'};
for (var item1 in b){
    console.log(b[item1]);
}
//在js中循环列表和字典时，都是在循环索引

其二：

c = [11,22,33,44];
for (var i=0;i<c.length;i=i+1){
    console.log(c[i]);
}
//不支持字典的循环，因为字典的key无序，且类型繁多不定

7.条件语句

if(条件){

}else if(条件){

}else{

}

符号：
== 仅是值相等
!==
=== 值和类型都相等
!===
|| 或
&& and

8.函数：

function 函数名(形参){

　　函数体
}
函数名(实参)

三种：

    普通函数
　　function func(){

　　]
    匿名函数
　　setInterval(function(){console.log(123);},5000)

    自执行函数（创建函数并且自动执行）
    (function(arg){
        console.log(arg);
    })(1)

9.序列化

JSON.stringify() 将对象转换为字符串

JSON.parse() 将字符串转换为对象类型

10.转义

客户端（cookie）  =》服务器端
将数据经过转义后，保存在cookie

11.eval以及时间操作

　python中：

var = eval(表达式)
        exec(执行代码)

javascript:
    eval()      是python中eval和exec的集合

12.时间

Date对象

var d = new Date()  //创建一个对象，d里就封装了当前时间

d.get**     获取
d.set**     设置

13.作用域

其他语言：以代码块作为作用域，即{   }为作用域

在python中，以函数作为作用域

javascript中，
    1）默认以函数作为作用域    除（let）
    2）函数的作用域在函数未被调用之前，已经创建
    3）函数的作用域存在作用域链（函数的嵌套），并且也是在被调用之前创建


    a = 'larlly'
    function func(){
        var a = 'larlly1'
        function inner(){
            console.log(a);
        }
        return inner;
    }

    var ret = func();
    ret();

    执行结果为larlly1

    4）函数内局部变量 提前声明

14.javascript面向对象

function foo(){
    var a = 'larlly'
}
foo()

function Foo(n){
    this.name=n;
}
var obj = new Foo('wo');
a.this代指对象，（python中self）
b.创建对象时，new函数()

原型：
function Foo(){
    this.name = n;
}
#  Foo的原型
Foo.prototype = {
    'SayName' : function(){
        console.log(this.name)
    }
}
obj = new Foo('we');
obj.sayName()
obj2 = new Foo('wee');

15.

16.

17.

posted @ 2018-01-25 15:22 larlly 阅读(179) 评论(0) 收藏举报

刷新页面返回顶部

larlly

python基础6-web之js

公告