ホームページ > 記事 > ウェブフロントエンド > JavaScriptに組み込みオブジェクトはありますか
JavaScript には組み込みオブジェクトがあります。組み込みオブジェクトは、JS 言語に付属するオブジェクトです。一般的なオブジェクトには、String オブジェクト、Array オブジェクト、Date オブジェクト、Boolean オブジェクト、Number オブジェクト、Math オブジェクト、RegExp オブジェクト、Global オブジェクトなどが含まれます。
このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
JavaScript のオブジェクトは、カスタム オブジェクト、組み込みオブジェクト、ブラウザ オブジェクトの 3 つのタイプに分類されます
最初の 2 つのオブジェクトは JS の基本コンテンツであり、ECMAScript に属し、3 番目のブラウザはオブジェクトは、当社の JS 固有の
に属します。組み込みオブジェクトは、JS 言語に付属するオブジェクト の一部を参照します。これらのオブジェクトは、開発者が使用するためのものであり、一般的に使用される、または最もよく使用されるいくつかの機能を提供します。基本的で必要な関数 (プロパティとメソッド)
組み込みオブジェクトの最大の利点は、迅速な開発に役立つことです
JavaScript には、Math、Date などの複数の組み込みオブジェクトが用意されています。 、配列、文字列など。
String オブジェクト: 文字列を操作するためのプロパティとメソッドを提供する String オブジェクト。
Array オブジェクト: Array オブジェクトは、配列操作のプロパティとメソッドを提供します。
Date オブジェクト: システムの日時情報を取得できる日時オブジェクト。
ブール オブジェクト: ブール オブジェクト、ブール変数はブール オブジェクトです。 (使用可能なプロパティとメソッドはありません)
Number オブジェクト: 数値オブジェクト。数値変数は数値オブジェクトです。
Math オブジェクト: 数学演算のプロパティとメソッドを提供する数学オブジェクト。
##Math オブジェクト // Math数学对象 不是一个构造函数,所以我们不需要 new来调用 而是直接使用里面的属性和方法即可
console.log(Math.PI); //一个属性 圆周率
console.log(Math.max(1, 2, 99)); //99
console.log(Math.max(-1, -12)); //-1
console.log(Math.max(1, 99, '数学对象')); //NaN
console.log(Math.max()); //-Infinity
ケース: 独自の数学オブジェクトをカプセル化する
var myMath = { PI: 3.141592653, max: function() { var max = arguments[0]; for (var i = 1; i < arguments.length; i++) { if (arguments[i] > max) { max = arguments[i]; } } return max; }, min: function() { var min = arguments[0]; for (var i = 1; i < arguments.length; i++) { if (arguments[i] < min) { min = arguments[i]; } } return min; } } console.log(myMath.PI); console.log(myMath.max(1, 5, 9)); console.log(myMath.min(1, 5, 9));
1Math の概要
Math オブジェクトはコンストラクターではなく、数学定数と関数のプロパティとメソッドを持ちます。 。数学関連の操作 (絶対値の検索、丸め、最大値など) では、Math のメンバーを使用できます。
Math.PI //圆周率 Math.floor() //向下取整 Math.ceil() //向上取整 Math.round() //四舍五入版 就近取整 注意-3,5 结果是 -3 Math.abs() //绝对值 Math.max()/Math.min() //求最大和最小值
// 1.绝对值方法 console.log(Math.abs(1)); //1 console.log(Math.abs(-1)); //1 console.log(Math.abs('-1')); //隐式转换 会把字符串型 -1 转换为数字型 console.log(Math.abs('wode')); //NaN // 2.三个取整方法 // (1)Math.floor() 地板 向下取整 往最小了取整 console.log(Math.floor(1.1)); //1 console.log(Math.floor(1.9)); //1 // (2)Math.ceil() ceil 天花板 向上取整 往最大了取整 console.log(Math.ceil(1.1)); //2 console.log(Math.ceil(1.9)); //2 // (3)Math.round() 四舍五入 其他数字都是四舍五入,但是 .5特殊,它往大了取 console.log(Math.round(1.1)); //1 console.log(Math.round(1.5)); //2 console.log(Math.round(1.9)); //2 console.log(Math.round(-1.1)); //-1 console.log(Math.round(-1.5)); //这个结果是 -1
2 乱数メソッドrandom()
//1. Math对象随机数方法 random() 返回一个随机的小数 0 =< x < 1 //2.这个方法里面不跟参数 // 3.代码验证 console.log(Math.random()); // 4.我们想要得到两个数之间的随机整数 并且包含这两个数 // return Math.floor(Math.random() * (max - min + 1)) + min; function getRandom(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } console.log(getRandom(1, 10)); // 5.随机点名 var arr = ['张三', '李四', '王五', '赵六', '张三疯'] // console.log(arr[0]); // console.log(arr[getRandom(0, 4)]); console.log(arr[getRandom(0, arr.length - 1)]);ケース: 数字当てゲームプログラムは 1 から 10 までの数字をランダムに生成します。ユーザーに数値 1 を入力させます。数値がその数値より大きい場合は、数値が大きすぎるため推測を続けるように求めるプロンプトが表示されます。2。数値より小さい場合は、数字が小さすぎる場合は、推測を続けてください。3. 数字と等しい場合は、推測が正しいことを示すメッセージが表示され、プログラムは終了します。
// 1.随机生成一个1~10的整数,我们需要用到Math.random()方法 // 2.需要一直猜到正确为止,所以一直循环 // 3.用while循环合适更简单 // 4.核心算法:使用if else if 多分支语句来判断大于,小于,等于 function getRandom(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } var random = getRandom(1, 10); while (true) { //死循环 var num = prompt('你来猜,输入1~10之间的一个数字'); if (num > random) { alert('猜大了'); } else if (num < random) { alert('猜小了'); } else { alert('猜对了'); break; } }
// 要求用户猜1~50之间的一个数字 但是只有10次猜的机会 function getRandom(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } var random = getRandom(1, 50); var i = 0; while (i < 10) { //死循环 var num = prompt('你来猜,输入1~50之间的一个数字'); if (num > random) { alert('猜大了'); } else if (num < random) { alert('猜小了'); } else { alert('猜对了'); break; //退出整个循环结束程序 } i++; } if (i = 10) { alert('全部猜错了'); }Date オブジェクト
##1Date の概要
Date オブジェクトとMath オブジェクトは異なります。これはコンストラクターなので、
Date インスタンスを使用して日付と時刻を処理する前にインスタンス化する必要があります。メソッドvar now = new Date(); console.log(now);
括弧で囲んだ場合は、パラメータ time に返します。たとえば、日付形式文字列は '2019-5-1' で、new Date('2019-5-1') または new Date('2019/5/) と書くことができます。 1')//Date() 日期对象 是一个构造函数 必须使用new 来调用创建我们的日期对象
var arr = new Date(); //创建一个数组对象
var obj = new Object(); //创建了一个对象实例
// 1.使用Date 如果没有参数 返回当前系统的当前时间
var date = new Date();
console.log(date);
// 2.参数常用的写法 数字型 2019,10,01 或者是 字符串型 '2019-10-1 8:8:8'
var date1 = new Date(2019, 10, 1);
console.log(date1); //返回的是 11月 不是 10月
var date2 = new Date('2019-10-1 8:8:8');
console.log(date2);
getFullyears() | 現在の年を取得します | dObj.getFullyears() |
getMonth () | 現在の月を取得 (0-11) | dObj.getMonth() |
getDate() | その日の日付を取得します | dObj.getDate() |
getDay() | 曜日を取得します (日曜日) 0 ~ 土曜日 6) | dObj.getDay() |
getHours() | 現在の時間を取得 | dObj.getHours () |
getMinutes() | 現在の分を取得 | #dObj.getMinutes()|
現在の秒数を取得します | dObj.getSeconds() |
方法名 | 说明 | 返回值 |
push(参数1...) | 末尾添加一个或多个元素,注意修改原数组 | 并返回新的长度 |
pop() | 删除数组最后一个元素,把数组长度减 1 无参数,修改原数组 |
返回它删除的元素的值 |
unshift(参数1...) | 向数组的开头添加一个或更多元素,注意修改原数组 | 并返回新的长度 |
shift() | 删除数组的第一个元素,数组长度减1无参数,修改原数组 | 并返回第一个元素值 |
// 添加删除数组元素的方法 // 1.push() 在我们数组的末尾 添加一个或者多个数组元素 push 推 var arr = [1, 2, 3]; // arr.push(4, 'white'); console.log(arr.push(4, 'white')); //5 数组长度 console.log(arr); // (1)push 是可以给数组追加新的元素 // (2)push() 参数直接写 数组元素就可以了 // (3)push完毕之后,返回的结果是 新数组的长度 // (4)原数组也会发生变化 //2.unshift 在我们数组的开头 添加一个或者多个数组元素 console.log(arr.unshift('red', 'green')); //7 console.log(arr); // (1)unshift 是可以给数组前面追加新的元素 // (2)unshift() 参数直接写 数组元素就可以了 // (3)unshift完毕之后,返回的结果是 新数组的长度 // (4)原数组也会发生变化 // 3.pop() 它可以删除数组的最后一个元素 console.log(arr.pop()); //white console.log(arr); // (1)pop 是可以删除数组的最后一个元素 一次只能删除一个元素 // (2)pop() 没有参数 // (3)pop完毕之后,返回的结果是 删除的那个元素 // (4)原数组也会发生变化 // 4.shift() 它可以删除数组的第一个元素 console.log(arr.shift()); //red console.log(arr); // (1)shift 是可以删除数组的第一个元素 一次只能删除一个元素 // (2)shift() 没有参数 // (3)shift完毕之后,返回的结果是 删除的那个元素 // (4)原数组也会发生变化
案例:筛选数组
// 有一个包含工资的数组[1500, 1200, 2000, 2100, 1800],要求吧数组中工资超过2000的删除,剩余的放到新数组里面 var arr = [1500, 1200, 2000, 2100, 1800]; var newArr = []; for (var i = 0; i < arr.length; i++) { if (arr[i] < 2000) { // newArr[newArr.length] = arr[i]; newArr.push(arr[i]); } } console.log(newArr);
4数组排序
方法名 | 说明 | 是否修改原数组 |
reverse() | 颠倒数组中元素的顺序,无参数 | 该方法会改变原来数组,返回新数组 |
sort() | 对数组的元素进行排序 | 该方法会改变原来数组,返回新数组 |
// 数组排序 // 1.翻转数组 var arr = ['red', 'white', 'blue']; arr.reverse(); console.log(arr); // 2.数组排序(冒泡排序) var arr1 = [2, 5, 77, 4, 7, 11, 1]; arr1.sort(function(a, b) { // return a - b;//升序的顺序排列 return b - a; //降序的顺序排列 }); console.log(arr1);
5数组索引方法
方法名 | 说明 | 返回值 |
indexOf() | 数组中查找给定元素第一个索引 | 如果存在,返回索引号;如果不存在,则返回-1 |
lastIndexOf() | 在数组中的最后一个的索引 | 如果存在,返回索引号;如果不存在,则返回-1 |
// 返回数组元素索引号方法 indexOf(数组元素) 作用就是返回该数组元素的索引号 从前面开始查找 //它只返回第一个满足条件的索引号 // 它如果在该数组里面找不到元素,则返回的是 -1 var arr = ['red', 'green', 'blue', 'white', 'bule']; console.log(arr.indexOf('blue')); //2 console.log(arr.indexOf('black')); //-1 // 返回数组元素索引号方法 lastIndexOf(数组元素) 作用就是返回该数组元素的索引号 从后面开始查找 var arr = ['red', 'green', 'blue', 'white', 'blue']; console.log(arr.lastIndexOf('blue')); //4
案例:数组去重
// 数组去重['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'] 要求去除数组中重复的元素 // 1.目标: 把旧数组里面不重复的元素选取出来放到新数组中,重复的元素只保留一个,放到新数组中去重 // 2.核心算法:我们遍历旧数组,然后拿着旧数组元素去查询新数组,如果该元素在新数组里面没有出现过,我们就添加,否则不添加 // 3.我们怎么知道该元素没有存在?利用 新数组.indexOf(数组元素) 如果返回是 -1 就说明 新数组里面没有该元素 // 封装一个 去重的函数 unique 独一无二的 function unique(arr) { var newArr = []; for (var i = 0; i < arr.length; i++) { if (newArr.indexOf(arr[i]) === -1) { newArr.push(arr[i]); } } return newArr; } var demo = unique(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b']) var demo1 = unique(['red', 'blue', 'blue']) console.log(demo); console.log(demo1);
6数组转换为字符串
方法名 | 说明 | 返回值 |
toString() | 把数组转换成字符串,逗号分隔每一项 | 返回一个字符串 |
join(分隔符) | 方法用于把数组中的所有元素转换为一个字符串 | 返回一个字符串 |
// 数组转换为字符串 // 1.toString() 将我们的数组转换为字符串 var arr = [1, 2, 3]; console.log(arr.toString()); //1,2,3 // 2.join(分隔符) var arr1 = ['green', 'blue', 'red']; console.log(arr1.join()); //green,blue,red console.log(arr1.join('-')); //green-blue-red console.log(arr1.join('&')); //green&blue&red
方法名 | 说明 | 返回值 |
concat() | 连接两个或多个数组,不影响原数组 | 返回一个新的数组 |
slice() | 数组截取slice(begin,end) | 返回被截取项目的新数组 |
splice() | 数组删除splice(第几个开始,要删除个数) | 返回被删除项目的新数组 注意,这个会影响原数组 |
slice()和 splice()目的基本相同
字符串对象
1基本包装类型
为了方便操作基本数据类型,JavaScript还提供了上特殊的引用类型:String、Number和Boolean。
基本包装类型就是把简单数据类型包装称为复杂数据类型,这样基本数据类型就有了属性和方法。
// 基本包装类型 var str = 'andy'; console.log(str.length); // 对象 才有 属性和方法 复杂数据类型才有 属性和方法 // 简单数据类型为什么会有length属性? // 基本包装类型:就是把简单的数据类型 包装称为了 复杂数据类型 // (1)把简单数据类型包装为复杂数据类型 var temp = new String('andy'); // (2)把临时变量的值 给str str = temp; // (3)销毁这个临时变量 temp = null;
2字符串的不可变
指的是里面的值不可变,虽然看上去可以改变内容,但其实是地址变了,内存中新开辟了一个内存空间。
// 字符串的不可变性 var str = 'andy'; console.log(str); str = 'red'; console.log(str); // 当重新给 str 赋值的时候,常量 'andy'不会被修改,依然在内存中 // 重新给字符串赋值,会重新在内存中开辟空间,这个特点就是字符串的不可变 // 由于字符串的不可变,在大量拼接字符串的时候会有效率问题 // 因为我们字符串的不可变 所以不要大量的拼接字符串 var str = ''; for (var i = 1; i <= 100000000; i++) { str += i; } console.log(str);//这个结果需要花费大量时间来显示,因为需要不断的开辟新的空间
3根据字符返回位置
字符串所有的方法,都不会修改字符串本身(字符串是不可变的),操作完成会返回一个新的字符串。
方法名 | 说明 |
indexOf('要查找的字符',开始的位置) | 返回指定内容在字符串中的位置,如果找不到就返回-1;开始的位置是indlastex索引号 |
lastIndexOf() | 从后往前找,只找第一个匹配的 |
// 字符串对象 根据字符返回位置 str.indexOf('要查找的字符',[起始的位置]) var str = '改革春风吹满地,春天来了'; console.log(str.indexOf('春')); console.log(str.indexOf('春', 3)); //从索引号是 3 的位置开始往后查找
案例:返回字符位置
// 查找字符串 'abcoefoxyozzopp'中所有o出现的位置以及次数 // 核心算法:先查找第一个o出现的位置 // 然后 只要indexOf 返回的结果不是 -1 就继续往后查找 // 因为 indexOf 只能查找到第一个,所以后面的查找,一定是当前索引加 1,从而继续查找 var str = 'abcoefoxyozzopp'; var index = str.indexOf('o'); var num = 0; // console.log(index); while (index !== -1) { console.log(index); num++; index = str.indexOf('o', index + 1); } console.log('o出现的次数是' + num);
// ['red', 'blue', 'red', 'green', 'pink', 'red'],求red出现的位置和次数 var str = ['red', 'blue', 'red', 'green', 'pink', 'red']; var index = str.indexOf('red'); var num = 0; // console.log(index); while (index !== -1) { console.log(index); num++; index = str.indexOf('red', index + 1); } console.log('red出现的次数是' + num);
4根据位置返回字符
方法名 | 说明 | 使用 |
charAt(index) | 返回指定位置的字符(index字符串的索引号) | str.charAt() |
charCodeAt(index) | 获取指定位置处字符的ASCII码(index索引号) |
str.charCodeAt(0) |
str[index] | 获取指定位置处字符 | HTML5,IE8+支持和charAt()等效 |
// 根据位置返回字符 // 1.charAt(index) 根据位置返回字符 var str = 'andy'; console.log(str.charAt(3)); //y // 遍历所有的字符 for (var i = 0; i < str.length; i++) { console.log(str.charAt(i)); } // 2.charCodeAt(index) 返回相应索引号的字符ASCII值 目的:判断用户按下了哪个键 console.log(str.charCodeAt(0)); //97(a的ASCII码是97) // 3.str[index] H5 新增的 console.log(str[0]); //a
案例:返回字符位置
// 有一个对象 来判断是否有该属性 对象['属性名'] var o = { age: 18 } if (o['age']) { console.log('里面有该属性'); } else { console.log('没有该属性'); } // 判断一个字符串 'abcoefoxyozzopp'中出现次数最多的字符,并统计其次数 // o.a = 1 // 0.b = 1 // 0.c = 1 // o.o = 4 // 核心算法:利用charAt() 遍历这个字符串 // 把每个字符都存储给对象,如果对象没有该属性,就为1,如果存在了就+1 // 遍历对象,得到最大值和该字符 var str = 'abcoefoxyozzopp'; var o = {}; for (var i = 0; i < str.length; i++) { var chars = str.charAt(i); //chars 是字符串的每一个字符 if (o[chars]) { //o[chars]得到的是属性值 o[chars]++; } else { o[chars] = 1; } } console.log(o);
// 2.遍历对象 var max = 0; var ch = ''; for (var k in o) { // k 得到的是 属性名 // o[k] 得到的是属性值 if (o[k] > max) { max = o[k]; ch = k; } } console.log(max); //4 console.log('最多的字符是' + ch); //最多的字符是o
5字符串操作方法
方法名 | 说明 |
concat(str1,str2,str3...) | concat()方法用于连接两个或多个字符串。拼接字符串,等效于+,+更常用 |
substr(start,length) | 从start位置开始(索引号),length取的个数 |
slice(start,end) | 从start位置开始,截取到end位置,end取不到(它们两都是索引号) |
substring(start,end) | 从start位置开始,截取到end位置,end取不到,基本和slice相同,但是不接受负值 |
// 字符串操作方法 // 1.concat('字符串1','字符串2'....) var str='andy'; console.log(str.concat('red')); //2. substr('截取的起始位置','截取几个字符'); var str1='改革春风吹满地'; console.log(str1.substr(2,2)); //第一个2 是索引号的 2 从第几个开始 第二个2 是取几个字符
// 1.替换字符 replace('被替换的字符','替换为的字符') 它只会替换第一个字符 var str = 'andyandy'; console.log(str.replace('a', 'b')); // 有一个字符串 'abcoefoxyozzopp' 要求把里面所有的 o 替换为 * var str1 = 'abcoefoxyozzopp'; while (str1.indexOf('o') !== -1) { str1 = str1.replace('o', '*'); } console.log(str1); // 2.字符转换为数组 split('分隔符') join 把数组转换为字符串 var str2 = 'red,pink,blue'; console.log(str2.split(',')); var str3 = 'red&pink&blue'; console.log(str3.split('&'));
【相关推荐:javascript学习教程】
以上がJavaScriptに組み込みオブジェクトはありますかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。