day 50 js-part1基础语法,数据类型及用法,流程控制语句,循环

 

js基本概念:

JavaScript 是世界上最流行的脚本语言。

JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。

JavaScript 是属于 web 的语言,它适用于 PC、笔记本电脑、平板电脑和移动电话。

JavaScript 被设计为向 HTML 页面增加交互性。

  • 核心(ECMAScript) 
  • 文档对象模型(DOM) Document object model (整合js,css,html)
  • 浏览器对象模型(BOM) Broswer object model(整合js和浏览器)

 

JS (JavaScript)

    一门编程语言,和 Python\Java\PHP\Go \C++\C# 类似的.
    
    
    node.js 可以跑在服务器上的JS

        
    ES6(EMCAScript 2016) /ES7 语法
    
    
    JS学习内容: (3天)
        1.JS语言基础:
            1.基本数据类型
            2.变量
            3.流程控制
            4.语法/注释
            
            5.函数
            6.对象
            
        2.DOM和BOM编程
        
        DOM --> Document Object Model
        BOM --> Browser  Object Model
        
        
    JS语法基础:
        语句结束之后要写分号;  *****
        $也可以做变量名
        推荐使用驼峰命名
    
    JS数据类型:
        数字类型
        
        字符串类型
            字符串自带的那些属性和方法
        字符串转数字
        
        布尔类型
        
        数组
            数组的内置属性和方法
            数组的遍历
                
        var i = 0;
        i++;    i= i+1;  --> i+=1(Python);
        
        
        对象(简单的对象)
            对象的遍历
        
        条件判断和循环
            if... else ...
            if... else if...else
            switch
                case 值1: 要做的事儿;break;
                case 值2: 要做的事儿;break;
                default: 条件都不满足默认执行的
{类似于python里面的条件判断,如果满足第一个条件就执行后面的代码,如果满足第二个条件就执行后面的代码,依次类推;如果不加上break的话,找到了满足条件的代码后,执行完了满足条件的内容会接着继续执行下面的内容,直至全部执行完才会终止程序}
                
            for 循环
            for (var i=0;条件;i++){
                循环要做的事儿;
            }
            
            while循环
                while (条件){
                   循环要做的事儿;
                }
                
            三元运算
                条件 ? 值1: 值2
View Code

注释是代码之母;

//一行注释用

/*

*

*

*多行注释用 ,跟html和css是一样的

*/

 注: 这里的每一行都需要有*否则,如果只有开始和结尾处的*/是无法执行注释的

 

 

js特有标签:

<script>

在此标签内写入js代码块

</script>

 

引入外部的js文件:

<script src="myscript.js"></script>

 

基本语法:

用;作为结束符,必须要有的

变量名跟python一样,使用数字,$,字母_,不能以数字开头,

声明变量使用var变量名;这样的格式来声明====>  var name="egon"    变量名是区分大小写的.

数据类型:

数字:js不区分整型和小数,

var a = 12.34;
var b = 20;
var c = 123e5;  // 12300000   这123e5---是在123后面加上五个零的意思,
var d = 123e-5;  // 0.00123   这123e-5-----是在123从后往前倒,小数点往前挪动5位
var s;//返回值undefined 没有值
var s=1; //s是数字
var s='1qw'//s是字符串
parseInt("abd");//返回值是非数字的值
parseInt(123);//返回值是数字
字符串:
var a = "Hello" var b = "world; var c = a + b; console.log(c); // 得到Helloworld

 字符串常用方法:

方法    说明
obj.length    返回长度
obj.trim()    移除空白
obj.trimLeft()    移除左边的空白
obj.trimRight()    移除右边的空白
obj.charAt(n)    返回第n个字符
obj.concat(value, ...)    拼接
obj.indexOf(substring, start)    子序列位置
obj.substring(from, to)    根据索引获取子序列
obj.slice(start, end)    切片
obj.toLowerCase()    小写
obj.toUpperCase()    大写
obj.split(delimiter, limit)    分割
 

拼接字符串一般使用“+”
View Code

 

 

 分别举例:

slice(start,end),切片顾头不顾尾

var a="alex23ag";
undefined
a
"alex23ag"
a.slice(2,5);
"ex2"

var a=[1,2,3];
undefined
a.length  //求该元素的长度
3



var b="  12 bo  ";
undefined
b.trim();  //去空格
"12 bo"


b
"  12 bo  "

b.trimLeft();  //去左边空格
"12 bo  "

b.trimRight();  //去右边空格
"  12 bo"

b.charAt(2);  //返回给元素的索引为2的数据
"1"

b.concat(123); //拼接元素,
"  12 bo  123"

b.concat(12,"we"); //拼接多个元素,
"  12 bo  12we"



a1
"12 bo"

a1.indexOf("b",0);//这里的indexOf是在数据a1里面找指定的元素"b",
然后从索引0开始找起,,找到一个即返回结果,不管后面是否还有其他的满足条件的结果.
如果找不到则返回-1.
3
a1.indexOf("o",0);
4
a1.indexOf(" ",0);
2
a1.indexOf(1,0);
0
a1.indexOf(2,0);
1


d
"12 bo12121212"
d.substring(0,8);//切片,只用正序,不用倒序,跟python的切片差不多,也是最后一位不取,顾头不顾尾

a1
"12 bo"
a1.toLowerCase()//小写
"12 bo"
a1.toUpperCase();//大写
"12 BO"

d
"12 bo12121212"
d.split(1,3);//这里是分割,把d字符串根据1来分割,然后只显示分割后的前三个元素,
(3) ["", "2 bo", "2"]
d.split(1,2);//这里是分割,把d字符串根据1来分割,然后只显示分割后的前两个元素,
(2) ["", "2 bo"]
View Code

 

拼接字符串:

d
"12 bo12121212"

a1
"12 bo"

a1+d
"12 bo12 bo12121212"

d+a1
"12 bo1212121212 bo"

 数组用法:

var a=[12,"ab"];

a[0];
12

a[1];
"ab"

a[2];
undefined

 数组用法:

方法    说明
obj.length    数组的大小
obj.push(ele)    尾部追加元素
obj.pop()    获取尾部的元素
obj.unshift(ele)    头部插入元素
obj.shift()    头部移除元素
obj.slice()    切片
obj.reverse()    反转
obj.join(seq)    将数组元素连接成字符串
obj.concat(val, ...)    连接数组
obj.sort()    排序

遍历数组中的元素:
for (var i=0;i<a.length;i++){
console.log(i);}

这句话翻译成白话文,就是定义一个i变量,让他的初始值为0,然后判断他的长度要小于
所要遍历的元素的长度,然后就执行后面的console.log(i)这就类似于python里面的print
打印功能,然后执行完一次后就自动加1,i++就类似于i+=1,再接着去执行后面一句,循环反复
直到都打印完为止.
View Code

 

 

用法分别举例:

var qa=[12,"re",23];
(3) [12, "re", 23]
qa.length;  //测量长度
3

qa.push(987);//尾部追加元素
4
qa
(4) [12, "re", 23, 987]

qa.pop();//提取了尾部的元素,
987
qa
(3) [12, "re", 23]  //尾部元素被提取之后就被删掉了,原本的元素里面就没有他了

qa.shift();//移除头部元素,然后原本的元素被提取头部后就没有他了
12
qa
(2) ["re", 23]

qa.unshift(332);//不移除就是插入的意思,这里在头部插入元素
3
qa
(3) [332, "re", 23]



qa
(3) [332, "re", 23]
qa.slice(1);  //这里是切掉第一个元素,然后把剩余的保留返回结果
(2) ["re", 23]
qa.slice(2);  //这里是切掉第一个元素,然后把剩余的保留返回结果
[23]

qa.reverse();
(3) [23, "re", 332] //按照原来的顺序倒转过来,仅仅是倒转而已

qa.sort();
(3) [23, 332, "re"]  //按照顺序从小到大排列

qa.join();
"23,332,re"//把数组里面的元素转换成字符串

qa.concat("aaa",12);
(5) [23, 332, "re", "aaa", 12]
View Code

 

 

对象:

类似于字典
var a = {"name": "Alex", "age": 18};
console.log(a.name);
console.log(a["age"]);

for (var i in a){
console.log(i,a[i]);
}
name egon
age 20
View Code
  • undefined表示的是当声明的变量未初始化时,该变量的默认值是undefined。还有就是函数无明确的返回值时,返回的也是undefined。
  • null表示值不存在

查询数据类型:

typeof "abd";
"string"
typeof null;
"object"
typeof true;
"boolean"
typeof 123;
"number"

 运算符:(跟python基本一致)

算数运算,

+ - * / % ++ --

比较运算,

> >= < <= != == === !==
1=="1" true===这是把字符串转换成数字来进行比较,js自动进行转换
1==="1" false====这是进行强比较,在值的比较的基础上,再更进一步进行类型的比较,要类型也相同才可以

逻辑运算,

&&(and) ||(or) !

赋值运算,

= += -= *= /=

 

流程控制:(基本跟python一致)

if, else:

var a = 10;
if (a > 5){
console.log("yes");
}else {
console.log("no");
}


if, else-if, else: 
var a = 10;
if (a > 5){
console.log("a > 5");
}else if (a < 5) {
console.log("a < 5");
}else {
console.log("a = 5");
}

 

 

 switch


var day
= new Date().getDay(); switch (day) { case 0: console.log("Sunday"); break; case 1: console.log("Monday"); break; default: console.log("...") }



var day = new Date().getFullYear();

switch (day) {
case 0:
console.log("Sunday");
break;
case 3:
console.log("Monday");
break;
case 2019:
console.log("current year");
break;
default:
console.log("...")
}

>>>:current year

 

for (var i=0;i<10;i++) {
  console.log(i);
}

 var i = 0;
 while (i < 4) {
 console.log(i);
 i++;
 }

 

三元运算符:

var a = 1;
var b = 2;
var c = a > b ? a : b

posted @ 2017-12-26 12:24  dream-子皿  阅读(151)  评论(0编辑  收藏  举报