JavaScript02—JavaScript对象
来源：互联网 发布：服务器防火墙端口 是否 编辑：程序博客网 时间：2024/05/18 07:32
String对象
- 声明方式：
var str = "hello"; var str2 = new String("hello!"); - 属性：str.length
- 方法：
- 大小写转换str.toLowerCase()/str.toUpperCase()
- 获取指定位置字符：str.charAt(指定字符位置)
- 查询指定字符串str.indexOf(findstr)/str.lastIndexOf:从后面找起
- **获取字符串**str.substring(开始位置,[结束位置])
- 替换字符串：str.replace(目的字符串,替换字符串),返回替换后的字符串
- 拆分字符串：str.split(分割用的字符串,[返回数组的最大长度])
Number对象
- 声明：
var num = 12.987; - 方法:
- num.toFixed(number)：转化为字符串，保留小数点后指定位数number 四舍五入
Array对象
- 声明：数组的长度是可变的
var a1 = new Array();var a2 = new Array(3);var a3 = new Array(100,"a",true);var a4 = [100,200,300];
- 二维数组：数组中的元素是数组
- 方法:
- x.reverse()反向数组，返回数组
- x.sort()数组排序，按字符顺序，32,23,111,12排序后111,12,23,32
var arr=[111,12,34,32];arr.sort();//结果：[111, 12, 32, 34]arr.sort(function sotFunc(a,b){return a-b;});//结果：[12, 32, 34, 111]Math对象
Math对象无需创建可以直接使用
Date对象
- 声明：
var now = new Date(); //自动保存当前时间初始化var now = new Date("2017/7/4 14:21"); //自动保存当前时间初始化 - 方法:
- 读取时间（日）day.getDate()//结果：4
- 读取时间（星期）day.getDay()//结果：2
- 读取时间（月）数组形式来存储月份，结果+1 day.getMonth()//结果：6实际月份为（6+1）
- 读取时间（年） day.getFullYear() //结果：2017
- 把 Date 对象的时间部分转换为字符串：toTimeString() “14:29:31 GMT+0800 (中国标准时间)”
- 把 Date 对象的日期部分转换为字符串：toDateString() “Tue Jul 04 2017”
- 根据本地时间格式，把 Date 对象的时间部分转换为字符串：toLocaleTimeString()”下午2:29:31”
- 根据本地时间格式，把 Date 对象的日期部分转换为字符串：toLocaleDateString() “2017/7/4”
使用Date对象获取当前具体时间
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>今日是何时</title><script type="text/javascript">function time(){ var now = new Date(); var year = now.getFullYear(); var month = now.getMonth()+1; var date = now.getDate(); var hour = now.getHours(); var minute = now.getMinutes(); var second = now.getSeconds(); var ary = ["日","一","二","三","四","五","六"]; var day = now.getDay(); var str = "现在是：" + year + "年" + month + "月" + date + "日 " + "周" + ary[day] + " " + hour + ":" + minute + ":" + second; alert( str );}</script></head><body> <div style="margin:0 auto; width:80px;"> <input type="button" value="今日是何时" onclick="time();" /> </div></body></html>RegExp对象
- RegExp对象表示正则表达式
声明：
var reg1 = /^\d{3,6}$/**gi**; var reg2 = new RegExp("^\d{3,6}$");
g：全局匹配
i：忽略大小写检测方法:
- reg.test(str)检索字符串中的指定值，返回true或false
- str.replace(regexp,toStr) 返回替换后的结果
- str.match(regexp) 返回匹配字符串的数组
- str.search(regexp) 返回匹配字符串的首字符索引
使用RegExp对象验证账号密码
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>登录系统</title><style type="text/css">#d1 { //border: 1px solid black; width: 200px; margin: 20% auto;}h1, p { text-align: center;}</style><script type="text/javascript">function checkName( emt ){ //调用时，传入this（正在操作的那个文本输入框） console.log("失去焦点了！开始检查账号！"); console.log( emt ); var name = emt.value; console.log("输入的账号是：" + name); var regexp = /^[a-z0-9]{3,10}$/; var isValid = regexp.test(name); if( isValid ){ return true; } else { alert("输入的账号，不是3~10位的小写字母或数字"); return false; }}function checkPassword( emt ){ console.log( emt ); var password = emt.value; var regexp = /^.{8,30}$/; var isValid = regexp.test(password); if( isValid ){ return true; } else { alert("输入的密码，不是8到30位的！"); return false; }}</script></head><body> <div id="d1"> <h1>登录系统</h1> <form action="login.do"> <p> 账号： <input type="text" id="name" onblur="checkName(this);"/> <!-- onblur属性，用于对失去焦点事件进行处理 --> </p> <p> 密码： <input type="password" id="password" onblur="checkPassword(this);"/> </p> <p> <input type="submit" value="登录"/> <a href="#">注册</a> </p> </form> </div></body></html>Function对象
- JS中函数就是function对象
- 函数：默认返回undefined，没有函数重载，无论参数多少调用同一个函数，没有接收到参数的默认为undefined
- arguments对象：表示函数参数的数组
使用arguments对象模拟重载
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>函数的定义</title><script type="text/javascript">function add( a ){ a++; console.log( a );}//让add引用变量，指向了一个新的function对象function add( a, b ){ //add(10)，会将10传入给a；参数b没有传入，默认值是undefined console.log( a + ", " + b ); //10, undefined var result = a + b; console.log( result );}// 使用隐含对象arguments，获得传入的参数// 对于传入的参数个数是可变的，可使用arguments对象function add(){ //console.log( arguments ); if( arguments.length == 0 ){ console.log( "没有传入任何参数." ); } else if( arguments.length==1 ){ console.log( ++arguments[0] ); } else { var sum = 0; for( var i=0; i<arguments.length; i++ ){ sum += arguments[i]; } console.log( sum ); }}</script></head><body> <h1>函数的定义</h1> <input type="button" onclick="add();" value="测试：不传入参数"/> <input type="button" onclick="add(10);" value="测试：传入10"/> <input type="button" onclick="add(10, 23);" value="测试：传入(10, 23)"/></body></html>- eval函数：计算表达式字符串，只接受原始字符串作为参数 ，参数不合法则抛出异常
使用eval()函数实现简单计算机
<!--input+select--><!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>js</title> <script type="text/javascript"> function method() { var num1 = document.getElementById("num1").value; var num2 = document.getElementById("num2").value; var operator = document.getElementById("operator").value; var str = num1+operator+num2; console.log(eval(str)); var result = document.getElementById("result"); result.innerText = eval(str); } </script></head><body><input id="num1" type="text"/><select id="operator"> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option></select><input id="num2" type="text"/><input type="button" value="=" onclick="method();"/><span id="result"></span></body></html>//使用button+input实现<!DOCTYPE html><html><head><meta charset="UTF-8"><title>简单计算器</title><script type="text/javascript">// 用于判断，是否是一个全新的计算过程var isNewCalc = true;function clk( btn ){ //获得被点击的按钮 上面的数字 console.log( btn.value ); //获得文本输入框 var inputText = document.getElementById("txtExp"); if( btn.value == "=" ){ var result = eval( inputText.value ); inputText.value = result; isNewCalc = true; } else if( btn.value=="C" ){ inputText.value= "0"; isNewCalc = true; } else if( btn.value=="DEL" ){ var txt = inputText.value; inputText.value = txt.substring(0, txt.length-1); } else { if( isNewCalc ){ inputText.value = ""; isNewCalc = false; } inputText.value += btn.value; }}</script></head><body> <h1>简单计算器</h1> <div style="border: 1px solid black; width: 270px; padding: 5px;"> <p> <input type="button" value="1" onclick="clk(this);" /> <input type="button" value="2" onclick="clk(this);" /> <input type="button" value="3" onclick="clk(this);" /> <input type="button" value="4" onclick="clk(this);" /> <input type="button" value="5" onclick="clk(this);" /> <input type="button" value="+" onclick="clk(this);" /> <input type="button" value="-" onclick="clk(this);" /> <input type="button" value="=" onclick="clk(this);" /> </p> <p> <input type="text" id="txtExp" size="30" value="0"/> <input type="button" value="DEL" onclick="clk(this);" /> <input type="button" value="C" onclick="clk(this);" /> </p> </div></body></html>阅读全文
0 0
- JavaScript02—JavaScript对象
- JavaScript02
- JavaScript02
- Day04-JavaScript02
- 初学JavaScript02
- 【视频】javascript02~03
- JavaScript02-页面布局
- 初识JavaScript02--网页换肤
- JavaScript——对象
- JavaScript基础—对象
- JavaScript—内置对象
- JavaScript—内置对象
- Javascript基础——详解Javascript对象
- javascript浏览器对象——window对象
- javascript浏览器对象——计时器对象
- javascript浏览器对象——History对象
- JavaScript内置对象——Math对象
- JavaScript对象——对象属性
- Java 8 Lambdas实现原理
- 序列操作（线段树）
- python写算法题：leetcode: 29. Divide Two Integers
- spark-伪分布式搭建
- 【自用】javanote170704（java基础学习）
- JavaScript02—JavaScript对象
- java多态
- 电商图片降质--nginx解决方案
- 遗传算法的matlab实现
- 基于梯度上升算法的Logistic回归
- 机器学习---opencv实现简单的KNN算法
- LeetCode 71 Simplify Path (栈)
- 【剑指Offer】：矩阵覆盖
- JS简单实现自定义弹窗及程序中断，继续效果
