欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

流程控制语句 函数 对象和数组

程序员文章站 2024-02-17 23:21:04
...

流程控制语句 函数 对象和数组

  • 流程控制语句
  • 函数
  • 对象和数组

流程控制语句

复习

if(5>4) alert('对');
if(){

}else{

}

if(){

}else if(){

}else{

}


switch(a+b){
    case 值:
        语句;
        break; 跳出所有循环 防止穿透
    case 值:
        语句;
        break; 
    default:
        语句;
}

var box = 1;
if(box<=5){
    alert(box);
    box++;
}
for(var i=0;i<=9;i++){

}

do while 循环 不管条件是否满足 先执行一遍循环体

do{

}while();


var box = 1;
do{
    alert(box); 
    box++;
}while(box <=9);

while 先判断再循环

var box=1;
while (box<=9){
    console.log(box);
    box++;
}

for in 列出对象的属性有哪些 先了解

    var person = {
                'name':'zhangsan',
                'age':18,
                'sex':'男'
            }
            for(var p in person){
                console.log(p);
            }


输出 : 
    name  age sex 

break continue 重点

for (var test=1;test<=10;test++) {
                if(test == 5) break;  跳出所有循环 
                document.write(test);
                document.write('<br />');
}
1
2
3
4

for (var test=1;test<=10;test++) {
                if(test == 7) continue; 跳出本次循环  继续下面的循环  
                document.write(test);
                document.write('<br />');
}
输出 1 2 3 4 5 6 8 9 10

with 先了解

var person = {
                'name':'zhangsan',
                'age':18,
                'sex':'男'
                 talk:函数名()
            }
            /*alert(person.name);
            alert(person.age);
            alert(person.sex);
            var n = person.name
            var a = person.age
            var s = person.sex
            alert("姓名:"+n+"年龄"+a+"性别"+s);*/

            with(person){
                var n=name;  //不用person.属性名
                var a=age;
                var s=sex;
            }
            alert("姓名:"+n+"年龄"+a+"性别"+s);

函数

  • js 函数 声明
  • return 返回值
  • arguments 对象

函数声明

function 函数名字(){  #没有参数的函数
    alert('只有调用我才执行');
}

function wenbiya(){
    alert("苦了农民百姓");
}

wenbiya(); #直接调用

function sum(num1,num2){  //形式参数
    alert(num1+num2);
}
sum(10,1000); //实际参数

函数return 返回值

function box(){
    return '我被返回';
}

alert(box());


function person(name,age){
    return '您的姓名:'+name+'您的年龄:'+age;
}

console.log(person("空空",35));

特殊return 非常重要

function test(num){
    if(num < 5) return num; #如果num<5 直接返回
    return '扛把子';
}
alert(test(6));

arguments 对象

function test(){
    //在不知道你有多少参数的情况下 相求第三个参数和第五个参数的和 
    return arguments[2]+arguments[4];
}

    alert(test(10,20,30,40,50,60));//80
    alert(test(9,8,7,6,5,4,3,2,1));//12
    alert(test(9,8,700,6,500,4,3,2,1));//1200


function test1(){
    return arguments.length; //获取参数的长度
}
    alert(test1(9,8));
    alert(test1(9,8,700,6));

?问题

不管你过来多少参数  我给你返回所有参数的和

1.有参数   
2.没有参数 直接返回0


function sums(){
    var sum = 0;
    if(arguments.length == 0 ) return sum;
    //如果有参数  累加  
    for (var i=0;i<arguments.length;i++) {
        sum+=arguments[i];
    }
    return sum;
}
alert(sums());  //0
alert(sums(1,2,3,4,5,6,7,8,9,10)); //55

对象

  • object 类型

object 类型

var person = new Object(); //空对象    new 可以省略 但是新创建的对象 尽量保留  提高代码的易读性 
person.name = '扣丁哥';
person.age = 18;

alert(person.name);



var person = {
    name:'扣丁哥',
    age:18,
}


var person = {
    'name':'扣丁哥',
    'age':18,
}


var person = {};//空对象   
person.name = '扣丁哥';
person.age = 18;


输出属性的值  
1.alert(person.name);
2.alert(person['age']);


对象的方法  

var box={
name:'扣丁哥',
age:18,
eat:function(){
   跟下面效果一样 
}
function eat(){
  跟上面效果一样
}
}


var box={
    name:'扣丁哥',
    age:18,
    eat:function(num1,num2){
       return num1+num2;
    }
}
alert(box.eat(5,6));


删除属性 delete 对象名.属性名;
var box={
    name:'扣丁哥',
    age:18,
    eat:function(num1,num2){
        return num1+num2;
    }
}
delete box.age;
alert(box.name);
alert(box.age); //会提示undefined
alert(box.eat(5,6));

数组

var arr = [1,2,3,4,5];
console.log(typeof arr);

var arr1 = new Array(1,2,3,4,5);
alert(arr1.length); //返回数组的长度   


var arr2 = new Array(2); //声明一个包含10个元素的数组   数组长度是10
console.log(arr2.length); //10

var arr3 = new Array(1,'abc',[1,2],true,null,box = {name:'zhangsan'});
console.log(arr3.length); //6 任何数据类型 包括数组在内都可以当成数组的元素  



字面量的形式 

var box = []; //创建一个空数组   
var box = [1,2,'a',null,true]; //包含元素的数组

var box = [1,2,]; //ie浏览器会认为 三个元素   w3c浏览器 认为2个   
console.log(box.length);
var box =[,,,]; ie w3c浏览器识别不一样    不要这么写   

console.log(box[4]); //获取下标为4的元素  第五个 
arr3[3] = false; //修改下表为3的元素 


console.log(test[test.length-1]); //获取最后一个元素 
test[test.length] = '云迪'; //添加元素到数组的末尾 

数组最多有4294967295 个元素 超出抛异常

var test = [
    {
        name:'zhangsan',
        age:18,
        talk:function(){
            return '大吉大利,今晚吃鸡';
        }
    },
    [1,'a',null,true],
    '张三',
    12+13
];

系统提供的数组方法

join 将数组拼接成字符串

var box = ['他强任他强','老子','尼克杨'];
alert(box.join(''));//将数组 拼接成字符串    
alert(box.join('@'));   
alert(box.join('|'));   

栈方法 先进后出 杯子 电梯 操作的是数组的结尾

push()
pop()

var box = ['a','b','c','d','e'];
console.log(box.push('f'));//输出新数组的长度  
console.log(box);//输出所有的元素
console.log(box.pop());//弹出数组的最后一个元素 f
console.log(box.pop());//e 
console.log(box.pop()); //d

队列方法 先进先出 操作的是数组的开头

unshift()
shift()

console.log(box);
console.log(box.unshift('f','g')); //返回 插入元素之后数组的新长度 
console.log(box); 

console.log(box.shift()); //弹出数组的第一个元素

排序方法

  • sort() 既可以排序数字 也可以排序字母
  • reverse()
var box = [1,4,2,3,5];
console.log(box.sort());
var box = [1,14,32,23,5];
console.log(box.sort()); //排序不准确   需要自己写函数 干预以下    
var box1 = ['e','f','b','a','c'];
console.log(box1.sort());

function compare(num1,num2){
    if(num1 < num2){
        return -1; //小于返回负数 表示 位置不动 还是num1 在num2前面
    }else {
        return 1; //调换位置  返回正数
    }
}
var box = [1,14,2,23,5];
console.log(box.sort(compare));//compare 当作参数传递给  sort   


reverse 反转倒叙的意思 
console.log(box.reverse()); 

两个方法 新数组 不会对原来的数组产生一样 会呈现给用户一个新的数组

  • concat
  • slice

concat

var box = ['a',1,'b',5];
var box1 = box.concat('计算机'); 
console.log(box1); //输出a 1 b 5 计算机
console.log(box);//输出a 1 b 5 原来数组 没有发生变化  

slice

var box = ['a',1,'b',5];
var box1 = box.slice(1,3);
//1,b
//从下标为1的元素开始截取 直到截取到下标为3 包括第一个不包括第三个[1,3)
var box1 = box.slice(1);//从下标为1的元素开始  截取到末尾  包括下标为1的    
var box1 = box.slice(0);//从下标为0的元素开始截取 直到结尾 
console.log(box1);
console.log(box);

综上:

复制数组有以下方法: 

​ push()

​ slice()

splice()

var box = ['a',1,'b',5];
var box1 = box.splice(1,3);
//从下标为1开始截取3个
console.log(box1); //1,'b',5   对原来的数组产生影响
console.log(box);//a


var box1 = box.splice(1,0,'科学','技术');
//从下标为1开始截取0个 然后再第一个位置插入 科学  技术 
console.log(box1);//因为截取了0个 所以box1 为空
console.log(box);//"a,科学,技术,1,b,5"


var box1 = box.splice(1,2,'科学','技术');
//从下标为1开始截取2个 然后再第一个位置插入 科学  技术 
console.log(box1);//因为截取了2个 box1 的值就是 1,b
console.log(box);//"a,科学,技术,5"


//splice 替换功能
var box1 = box.splice(1,1,666);
console.log(box1);//1
console.log(box);//a,666,b,5

时间和日期

js 提供的一些组件方法

  1. 首先获取时间对象
  2. 调用方法
var timed = new Date();
console.log(timed.toDateString());//Mon Aug 20 2018
console.log(timed.toTimeString());//15:52:41 GMT+0800 (中国标准时间)
console.log(timed.toLocaleDateString());//2018年8月20日
console.log(timed.toLocaleTimeString());//下午3:53:32



    var timed = new Date();
    /*console.log(timed.toDateString());//Mon Aug 20 2018
    console.log(timed.toTimeString());//15:52:41 GMT+0800 (中国标准时间)
    console.log(timed.toLocaleDateString());//2018年8月20日
    console.log(timed.toLocaleTimeString());//下午3:53:32*/
    console.log(timed.getTime());//1534751668024 获取日期的毫秒数
    console.log(timed.setTime(1534751668024));//以毫秒数设置日期 可能会改变整个日期
    console.log(timed.getTime());
    console.log(timed.getFullYear());//2018
    console.log(timed.setFullYear(2020));//2018
    console.log(timed.getFullYear());
    console.log(timed.getMonth());//月份从0开始返回7 代表 8月
    console.log(timed.setMonth(11));//设置年份
    console.log(timed.toLocaleDateString())
    console.log(timed.getDate());//20号 
    console.log(timed.setDate(25)); //返回的是毫秒数
    console.log(timed.getDay());
    //星期几console.log(timed.setDay());报错
    console.log(timed.getHours());
    console.log(timed.setHours(16));
    console.log(timed.getHours());
    console.log(timed.getMinutes());
    console.log(timed.setMinutes(6));
    console.log(timed.getMinutes());
    console.log(timed.getSeconds());
    console.log(timed.setSeconds(37));

正则表达式 用来验证用户输入的内容是否符合你定的规范

  • 登陆注册 表单验证 防止用户输入

创建正则表达式

  1. new RegExp(“规则”,参数)
var test1 = new RegExp("kangbazi",'igm'); //创建规则
var contents = prompt("请输入你的昵称");//用户输入的内容 
//test()方法用来检测用户输入的是否符合规则
//规则.test(内容);
if(test1.test(contents)){
    alert("欢迎光临");
}else{
    alert("谢绝入内");
}
  1. /规则/参数
    var box = /kangbazi/ig;
    var contents = prompt("请输入你的昵称");
    alert(box.test(contents));
    alert(box.exec(contents));
参数 含义
i 忽略大小写 KANGBAzi 跟 kangbazi 效果一样
g 全局匹配
m 多行匹配

检测的方法

方法 说明
test() 返回true或false
exec() 返回匹配的结果 如果匹配到返回匹配到的结果 否则 返回 null
var test1 = new RegExp('kangbazi','i'); //创建规则
var contents = prompt("请输入你的昵称");
//alert(test1.test(contents));
alert(test1.exec(contents));