美文网首页
day5-js相关内容

day5-js相关内容

作者: 旧时初_2e8d | 来源:发表于2018-08-17 21:46 被阅读0次

一、js基础语法

1.js中的注释

//这是单行注释
/*
这个是多行注释
*/

//2.语句

一条语句结束需要加分号(现在的js版本也可以不写)
一行写多条语句必须使用分号隔开

3.js没有缩进问题,用{}表示一个块

4.基本数据类型

Number(数字)、String(字符串)、Boolean(布尔)、Array(数组)--列表、Object(对象)--字典、function(函数)、Null、Underfined

5.字面量

数字字面量

89;
100;
10.22;
3e5;

字符串字面量

'afaf';
"faf";

布尔字面量

true;
false;

数据字面量

{1,2,'ban',true}
[];

对象的字面量(对象的key又是属性,不用加引号)

var dict={a:'rw',b:'wef'};
console.log(dict.a,dict.b)

6.标识符

a.使用标识符来命名

由字母、数字、_、和$组成,数字不能开头

var hfoej;
b.不能是关键字
var  for
c.大小写敏感。y和Y不一样
d.规范:1.见名知义
在控制台中打印括号中的内容,功能和python中的print一样
console.log('heiio world');

二、变量的声明

在js中可以通过声明变量来保存数据

1.语法

var 变量名
var 变量名 - 初值;
说明:var是关键字;
变量名:标识符,不能随意使用_或者$开头:驼峰式命名股则(第一个单词首字母小写,后面每个单词的首字母大写)、

var userName;
userName = 'esng';
console.log(userName)


var score =100
console.log(score)
同时声明多个变量
var name,age,sex;
var name='张安',agge = 12,sex = '男'
一个变量可以存储任何类型的值,声明变量的时候,变量没有赋值,默``认是underfined

三、运算符

1.数学运算符:+,-,*,/,%,++,--

a.+ - *和数学中的求和,求差以及求乘积、取余是一样的
var a = 10+29;
var b = 49-23;
var c = 19*2;
var d = 7%2
b./和数学中的除一样
var e = 5/2;
console.log(e)

c.++,--(单运算符)/*

语法:变量++/变量-- ++变量/--变量
++:自加1
--:自减1

var a1 = 10
var b1 = 10
a1++
++b1
console.log(a1,b1)//11,11


var c1 = a1++  //++/--写到后面的时候,线赋值,再自加或者自减

var c2 = ++b1  //++/--写到前面的时候。先自加或者自减,再赋值
console.log(c1,c2)//11,12

2.比较运算符:<,>,==(相等),!=,>=,<=,===(完全相等),!==,>==,<==

结果都是布尔值

==:判断值是否相等
console.log(5==5)
console.log(5=='5')
===:判断值和类型是否相等
console.log(5===5)
console.log(5==='5')

console.log(5!=5,'5'!=5) //false  false
console.log(5!==5,'5'!==5) //false true

3.逻辑运算符:&&(与),||(或),!(非)

console .log('与:',true&&true,true&&false)
console .log('或:',true||true,true||false)
console.log('非:',!true,!false)

4.赋值运算符:=, +=,-=,*=,/=,%=

赋值运算符的左边必须是变量
和python的语法一样

5.三目运算符 ?:

a.格式:
 条件语句?值1:值2
b.结果:

判断条件语句的结果是否是true,如果是true,name表达式的结果就是值1 否则是值2

var a= 10>30 ?10:20
console.log(a) //20

var a1 = 49
var a2 =77
console.log(a1>a2?a1:a2)

6.运算符的优先级和python基本一样,可以通过括号来改变运算顺序

四、分支结构

js中的分支结构有两种:if语句 switch语句

1.if语句

a. if(条件语句){满足条件要执行的代码块}
var age = 18
if (age>=18){
    console.log('成年')
}
b.if(条件){语句块1}else{语句块2}
if(age>=18){
    console.log('成年')
}
else{
    console.log('未成年')
}
c.if-else if - else(相当于python中的if-elif-else)
if(age<18){
    console.log('未成年')
}else if(age<40){
    console.log('青年')
}else{
    console.log('老年')
}

2.switch语句

  switch(变量){
    case 值1:
        语句1;
        break;
       case 值2:
        语句2;
        break;

        default:
        语句3;
        break;

}
执行过程:

使用变量的值依次和后边每个case后面的值进行判断。
看是否相等(是否完全相等),如果相等就执行那个case后面对应的语句;如果前面每个case的值都和变量的值不相等,
就执行default后面的语句

var score = 10;
switch(score){
    case 1:
    console.log('F');
    break;
    case 4:
    console.log('D');
    break;
    case 10:
    console.log('C');
    break;
    
    default:
    console.log('其他');
    break;
    
}


 score = 8;
switch(score){
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:
    console.log('不及格');
    break;
    case 6:
    case 7:
    console.log('及格');
    break;
    case 8:
    case 9:
    console.log('良好');//switch中的break,可以让switch直接结束
    break;
    case 10:
    console.log('优秀');
    default:
    console.log('其他');
    break;
    
}

五、循环结构

js中的循环 分为for循环和while循环

1.for循环

a. for in (和python中的for循环一样)

for(变量 in 数组/对象){函数体}

var arr1 = [1,2,'adc']
//x取的是下标
for (var x in arr1){
    console.log(arr1[x])
}

var obj1 = {name:'张三',age:30}
//key拿到的是属性名
for (var key in obj1){
    console.log(key,obj1[key])
}
b.for(表达式1;表达式2;表达式3){循环体}
执行过程:

先执行表达式1,然后再判断表达式2的结果是不是true,如果是true就执行循环体。
执行完循环体,再执行表达式3,再判断表达式2的结果是否是true,如果是true有执行循环体
执行完循环体,再执行表达式3,以此类推
直到表达式2的结果是false,循环结束

//计算1+2+...+100
var sum = 0
for (var i = 1; i < 101; i++) {
//  console.log(i)
    sum += i
}
console.log(sum)

2.while循环

a.while(条件语句){循环体}--和python一样
var sum = 0
var i = 1
while(i<101){
    sum += i
    i++
}
console.log(sum)
b.do-while循环:do{循环体}(条件语句);

执行过程:
先执行循环体,然后判断条件是否成立,如果成立再执行循环体....
以此类推,直到条件不成立,循环结束。

var sum2 = 0
var i = 1
do{
    sum2 +=i;
    i++;
}
while(i<=100);
console.log(sum2)

3.break和continue(和python一样)

break 语句用于跳出循环。

continue 用于跳过循环中的一个迭代。

六、函数

1.函数的声明

function 函数名(参数列表){函数体}
  • a. function--关键字
  • b. 函数名--驼峰式;见名知义
  • c. 参数:参数可以有默认值,有默认值的参数要写在后面;
    传参的时候是按实参的位置来传参
    保证每个参数都有值
  • d. 函数体:实现函数的功能,只有在调用的时候才执行
function sum1(num1,num2){
    console.log('求两个数的和')
    return num1+num2
}
console.log(sum1(10,20))
函数没有return的时候,函数的返回值是undefined
function func1(){
    console.log('我是函数1')
}
console.log(func1())

2.函数的调用

函数名(实参列表)
调用过程和python一样

3.作用域

全局变量:声明在函数外面的变量(从变量声明到文件结束)
局部变量:声明在函数里面的变量(从变量声明到函数结束);函数的参数也是局部变量

//aa就是全局变量
var aa = 10

function func2(){
    //bb就是局部变量
    var bb = 100
    console.log(bb,aa)
    
    //函数中可以修改全局变量的值
    aa =20
    
    //函数中可以声明函数
    function func3(){
        bb = 30
        console.log(bb)
    }
    
}
console.log(aa)

func2()

//可以将函数作为变量
var a = func2
a()
//个数不定参数,js不支持

七、数据类型

数字、字符串、布尔、列表、对象

1.数字:包含整数和小数
var num1 = 10
var num2 = new Number()
console.log(num2+10)
2.字符串

''和""括起来的字符串

  • b.转义字符(和python一样)
  • c.字符编码也是unicode编码
var str1 = 'hfiqhghqu'


var str2 = '\n'
var str3 = '\\'
  • e.获取字符串长度
console.log(str1.length)
  • f.获取单个字符:字符串(下标)
    下标:1.范围是0-长度-1 2.如果越界,不报错,但是结果是underfinedjs中的字符串不能切片

  • g.运算符操作 js中只支持加操作,不支持乘
    字符串1+字符串2 --- 拼接两个字符串
    js中字符串可以和其他任何数据进行加操作,其效果都是字符串连接(会将其他数据转换成字符串)

console.log('123'+'asd','abd'+100)
  • h.字符串相关方法(查)

字符串方法

3.对象、构造方法(类)

var obj1 = {name:'张三',age:18}
console.log(obj1.name,obj1['name'])


//声明构造方法
function Person(){
    this.name = 'abd'
    this,age = 18
    this.sex = '女'
}
var p1 = new Person()
p1.name = 'hhh'
p1.age =49
console.log(p1,typeof(p1))

相关文章

  • day5-js相关内容

    一、js基础语法 1.js中的注释 //这是单行注释/*这个是多行注释*/ //2.语句 一条语句结束需要加分号(...

  • day5-js基础语法

    1.js基础语法 代码示例 2.变量 代码示例 3.运算符 代码示例 4.分支结构 代码示例 5.循环结构 代码示...

  • day5-js基础语法

    js基础 1.js基础语法 1.注释// 单行注释/*多行注释多行注释*/ 2.标识符标识符就是用来命名的(给变量...

  • (25)day5-js基础语法

    5.1 什么是js 1.什么是jsjs是JavaScript的缩写,是web标准中的行为标准,负责网页中变化的部分...

  • 简书更新计划

    计划将简书更新的内容分为 1.项目管理相关内容 2.一建考试相关内容 3.品牌追溯相关内容 4.其它学习相关内容 ...

  • 周迭代计划,第65周

    本周计划,演说者相关内容复习+视觉化思维相关内容复习

  • 日志---C/S

    日志相关内容

  • iOS 推送以及小红点

    思路: 1.设置友盟推送相关内容 // 友盟推送相关内容设置 - (void)setUMengPushMessag...

  • 相关内容

    论文 作品分析:类似于美术课激发幼儿对好人和坏人的理解,为什么认为带黑眼睛的是坏人【对话过程】 多查文献,外文文献...

  • Flask框架(4) -数据库

    数据库相关内容整理如下:

网友评论

      本文标题:day5-js相关内容

      本文链接:https://www.haomeiwen.com/subject/yetxiftx.html