您好,登錄后才能下訂單哦!
這期內(nèi)容當(dāng)中小編將會給大家?guī)碛嘘P(guān)JavaScript中怎么使用操作符和表達式,文章內(nèi)容豐富且以專業(yè)的角度為大家分析和敘述,閱讀完這篇文章希望大家可以有所收獲。
一、一元操作符
1.delete操作符
delete 操作符用于刪除對象的某個屬性;如果沒有指向這個屬性的引用,那它最終會被釋放
語法:delete expression
delete 操作符會從某個對象上移除指定屬性。成功刪除的時候回返回 true,否則返回 false
let Employee = { age: 28, name: 'abc', designation: 'developer' }; console.log(delete Employee.name); // returns true console.log(delete Employee.age); // returns true console.log(Employee); //{designation: "developer"}
2.typeof操作符
typeof操作符返回一個字符串,表示未經(jīng)計算的操作數(shù)的類型
語法:typeof operand; typeof (operand);
typeof NaN === 'number'; typeof Number(1) === 'number'; typeof "" === 'string'; typeof true === 'boolean'; typeof Symbol('foo') === 'symbol'; typeof undefined === 'undefined'; typeof null === 'object' typeof [1, 2, 4] === 'object'; typeof new Boolean(true) === 'object'; typeof new Number(1) === 'object'; typeof new String("abc") === 'object'; typeof function(){} === 'function';
3.void運算符
void 運算符 對給定的表達式進行求值,然后返回 undefined
語法:void expression
<a href="javascript:void(0);" rel="external nofollow" > 這個鏈接點擊之后不會做任何事情,如果去掉 void(), 點擊之后整個頁面會被替換成一個字符 0。 </a> <p> chrome中即使<a href="javascript:0;" rel="external nofollow" >也沒變化,firefox中會變成一個字符串0 </p> <a href="javascript:void(document.body.style.backgroundColor='green');" rel="external nofollow" > 點擊這個鏈接會讓頁面背景變成綠色。 </a>
二、關(guān)系操作符
1.in運算符
如果指定的屬性在指定的對象或其原型鏈中,則in 運算符返回true
語法:prop in object
let trees = new Array("redwood", "bay", "cedar", "oak", "maple"); console.log(0 in trees); // 返回true console.log(3 in trees); // 返回true console.log(6 in trees); // 返回false console.log("bay" in trees); // 返回false (必須使用索引號,而不是數(shù)組元素的值) console.log("length" in trees); // 返回true (length是一個數(shù)組屬性)
2.instanceof運算符
instanceof 運算符用來測試一個對象在其原型鏈中是否存在一個構(gòu)造函數(shù)的 prototype 屬性
語法:object instanceof constructor
let simpleStr = "This is a simple string"; let myString = new String(); let newStr = new String("String created with constructor"); let myDate = new Date(); let myObj = {}; simpleStr instanceof String; // 返回 false, 檢查原型鏈會找到 undefined myString instanceof String; // 返回 true newStr instanceof String; // 返回 true myString instanceof Object; // 返回 true myDate instanceof Date; // 返回 true myObj instanceof Object; // 返回 true, 盡管原型沒有定義
三、表達式
1.this
在函數(shù)內(nèi)部,this的值取決于函數(shù)被調(diào)用的方式。在嚴格模式下,this將保持他進入執(zhí)行上下文時的值,所以下面的this將會默認為undefined
function f2(){ "use strict"; // 這里是嚴格模式 return this; } f2() === undefined; // true
當(dāng)一個函數(shù)在其主體中使用 this 關(guān)鍵字時,可以通過使用函數(shù)繼承自Function.prototype 的 call 或 apply 方法將 this 值綁定到調(diào)用中的特定對象
function add(c, d) { return this.a + this.b + c + d; } let o = {a: 1, b: 3}; // 第一個參數(shù)是作為‘this'使用的對象 // 后續(xù)參數(shù)作為參數(shù)傳遞給函數(shù)調(diào)用 add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16
調(diào)用f.bind(someObject)會創(chuàng)建一個與f具有相同函數(shù)體和作用域的函數(shù),但是在這個新函數(shù)中,this將永久地被綁定到了bind的第一個參數(shù),無論這個函數(shù)是如何被調(diào)用的
function f(){ return this.a; } let g = f.bind({a:"azerty"}); console.log(g()); // azerty let h = g.bind({a:'yoo'}); // bind只生效一次! console.log(h()); // azerty
在箭頭函數(shù)中,this與封閉詞法上下文的this保持一致。在全局代碼中,它將被設(shè)置為全局對象
let globalObject = this; let foo = (() => this); console.log(foo() === globalObject); // true
2.super
語法:
super([arguments]); // 調(diào)用 父對象/父類 的構(gòu)造函數(shù)
super.functionOnParent([arguments]); // 調(diào)用 父對象/父類 上的方法
在構(gòu)造函數(shù)中使用時,super關(guān)鍵字將單獨出現(xiàn),并且必須在使用this關(guān)鍵字之前使用。super關(guān)鍵字也可以用來調(diào)用父對象上的函數(shù)
class Human { constructor() {} static ping() { return 'ping'; } } class Computer extends Human { constructor() {} static pingpong() { return super.ping() + ' pong'; } } Computer.pingpong(); // 'ping pong'
3.new
new 運算符創(chuàng)建一個用戶定義的對象類型的實例或具有構(gòu)造函數(shù)的內(nèi)置對象的實例
function Car() {} car1 = new Car() console.log(car1.color) // undefined Car.prototype.color = null console.log(car1.color) // null car1.color = "black" console.log(car1.color) // black
4.展開語法
可以在函數(shù)調(diào)用/數(shù)組構(gòu)造時, 將數(shù)組表達式或者string在語法層面展開;還可以在構(gòu)造字面量對象時, 將對象表達式按key-value的方式展開
在函數(shù)調(diào)用時使用展開語法
function myFunction(x, y, z) { } let args = [0, 1, 2]; myFunction.apply(null, args); //展開語法 function myFunction(x, y, z) { } let args = [0, 1, 2]; myFunction(...args);
構(gòu)造字面量數(shù)組時使用展開語法
let parts = ['shoulders','knees']; let lyrics = ['head',... parts,'and','toes']; // ["head", "shoulders", "knees", "and", "toes"]
數(shù)組拷貝
let arr = [1, 2, 3]; let arr2 = [...arr]; // like arr.slice() arr2.push(4); // arr2 此時變成 [1, 2, 3, 4] // arr 不受影響
連接多個數(shù)組
let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; // 將 arr2 中所有元素附加到 arr1 后面并返回 let arr3 = arr1.concat(arr2); //使用展開語法 let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; let arr3 = [...arr1, ...arr2];
5.類表達式
類表達式是用來定義類的一種語法
let Foo = class { constructor() {} bar() { return "Hello World!"; } }; let instance = new Foo(); instance.bar(); // "Hello World!"
6.函數(shù)表達式
function 關(guān)鍵字可以用來在一個表達式中定義一個函數(shù),你也可以使用 Function 構(gòu)造函數(shù)和一個函數(shù)聲明來定義函數(shù)
函數(shù)聲明提升和函數(shù)表達式提升:JavaScript中的函數(shù)表達式?jīng)]有提升,不像函數(shù)聲明,你在定義函數(shù)表達式之前不能使用函數(shù)表達式
/* 函數(shù)聲明 */ foo(); // "bar" function foo() { console.log("bar"); } /* 函數(shù)表達式 */ baz(); // TypeError: baz is not a function let baz = function() { console.log("bar2"); };
7.function*表達式
function關(guān)鍵字可以在表達式內(nèi)部定義一個生成器函數(shù),function 這種聲明方式(function關(guān)鍵字后跟一個星號)會定義一個生成器函數(shù)(generator function),它返回一個 Generator 對象
語法:function* name([param[, param[, ... param]]]) { statements }
function* idMaker(){ let index = 0; while(index<3) yield index++; } let gen = idMaker(); console.log(gen.next().value); // 0 console.log(gen.next().value); // 1 console.log(gen.next().value); // 2 console.log(gen.next().value); // undefined
接收參數(shù)
function* idMaker(){ let index = arguments[0] || 0; while(true) yield index++; } let gen = idMaker(5); console.log(gen.next().value); // 5 console.log(gen.next().value); // 6
傳遞參數(shù)
function *createIterator() { let first = yield 1; let second = yield first + 2; // 4 + 2 // first =4 是next(4)將參數(shù)賦給上一條的 yield second + 3; // 5 + 3 } let iterator = createIterator(); console.log(iterator.next()); // "{ value: 1, done: false }" console.log(iterator.next(4)); // "{ value: 6, done: false }" console.log(iterator.next(5)); // "{ value: 8, done: false }" console.log(iterator.next()); // "{ value: undefined, done: true }"
表達式
let x = function*(y) { yield y * y; };
上述就是小編為大家分享的JavaScript中怎么使用操作符和表達式了,如果剛好有類似的疑惑,不妨參照上述分析進行理解。如果想知道更多相關(guān)知識,歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。